# 180: Majstrowanie przy wideo na telefonie komórkowym - CSS-Tricks

Spisie treści

Uczciwe ostrzeżenie: nie jestem ekspertem w tej dziedzinie, po prostu bawię się wideo w Internecie i rozwiązuję niektóre problemy, które mam, pokazując klipy wideo w postach na blogu.

W tym filmie mam symulator iOS i umieszczam tag wideo HTML w podstawowym dokumencie HTML, aby szybko nagrać wideo z Kap.

W przypadku wideo należy wziąć pod uwagę wiele rzeczy:

  1. Dając mu kontrolę! Jak w, . Zauważ, że w filmie zajęło mi chwilę, zanim zdałem sobie sprawę, dlaczego wideo nie pojawiło się w ogóle na telefonie komórkowym, dopóki się nie pojawiło.
  2. Odtwarzanie wideo w tekście, na przykład , co zapobiega wyświetlaniu go na pełnym ekranie na telefonie komórkowym w momencie, gdy go odtworzysz.
  3. Zmieniam to płynnie i ze współczynnikiem proporcji.
  4. Gdzie to hostować. Czy Twój serwer WWW jest w porządku? Czy powinien znajdować się w sieci CDN? Czy powinieneś używać hosta multimedialnego, który specjalizuje się w takich rzeczach? W filmie umieszczam go na Droplr, co jest wygodne, następnie na Hostingu zasobów CodePen, który jest również przydatny, i ostatecznie na Cloudinary, ponieważ może robić wymyślne rzeczy, takie jak optymalizacja i obsługa formatu.
  5. Upewniam się, że film wygląda jak cholerny film. Na telefon komórkowy, jeśli używasz , czyli plakatu: . W przeciwnym razie otrzymasz puste białe nic. Czasami samo to jest warte skorzystania z jakiegoś pomocnika.

Oczywiście możesz po prostu rzucić wideo na YouTube lub cokolwiek i uzyskać dobrą obsługę wideo za darmo. Ale YouTube nie zawsze jest odpowiedni dla małych, małych filmów demonstracyjnych, z którymi miałem do czynienia tutaj. Poza tym są ciężkie, więc możesz patrzeć na leniwe ładowanie ich.

Ostatecznie patrzymy na studio.cloudinary.com. Może robić kilka fajnych rzeczy, takich jak oferowanie dostosowanego odtwarzacza i strumieniowanie z adaptacyjną szybkością transmisji bitów, co jest fantazyjne i naprawdę wydaje się ważne dla najlepszej możliwej wydajności wideo.

Interesujące artykuły...