# 180: Vrtání s videem v mobilu - Triky CSS

Anonim

Spravedlivé varování: Nejsem žádný odborník na tyto věci, jen si hraji s videem na webu a řeším některé problémy, které mám při předvádění videoklipů v příspěvcích na blogu.

V tomto videu mám simulátor iOS a do základního dokumentu HTML vkládám značku videa HTML pro rychlé video, které jsem zaznamenal pomocí Kap.

S videem je třeba zvážit spoustu věcí:

  1. Dát to pod kontrolu! Stejně jako v . Všimněte si, že ve videu mi trvalo minutu, než jsem si uvědomil, proč se video vůbec nezobrazilo v mobilu, dokud se to nestalo.
  2. Přímé přehrávání videa , které znemožňuje přechod na celou obrazovku v mobilu, jakmile jej přehrajete.
  3. Dimenzování plynule as poměrem stran.
  4. Kde ho hostit. Je váš webový server v pořádku? Mělo by to být na CDN? Měli byste použít mediálního hostitele, který se specializuje na takové věci? Ve videu to vykreslím na Droplr, což je pohodlné, pak na CodePen Asset Hosting, který je také užitečný, a nakonec na Cloudinary, protože dokáže dělat fantastické věci, jako je optimalizace a zpracování formátu.
  5. Zajistěte, aby video vypadalo jako zatracené video. Na mobilní telefon, pokud používáte , to znamená, že plakát: . V opačném případě dostanete prázdné bílé nic. Někdy to samo o sobě stojí za to použít nějakého pomocníka.

Samozřejmě můžete video jednoduše přichytit na YouTube nebo cokoli jiného a získat dobrou manipulaci s videem za nic. Ale YouTube není vždy vhodný pro malá ukázková videa, jako jsem to řešil tady. Navíc jsou těžké, takže se možná díváte na líné nakládání.

Nakonec se podíváme na studio.cloudinary.com. Může dělat nějaké úhledné věci, jako je nabídka přizpůsobeného přehrávače a streamování adaptivního datového toku, což je fantazie a opravdu se zdá být důležitou věcí pro nejlepší možný výkon videa.