# 180: Böngészés a videóval a mobilon - CSS-trükkök

Anonim

Tisztességes figyelmeztetés: Nem vagyok szakértő ezekben a dolgokban, csak az interneten játszom a videót, és foglalkozom néhány kérdéssel, amely a videoklipek blogbejegyzésekben való bemutatása során merül fel.

Van egy iOS-szimulátorom ebben a videóban, és egy HTML-videocímkét teszek egy alapvető HTML-dokumentumba egy gyors videóhoz, amelyet Kapdal rögzítettem.

Sok dolgot kell figyelembe venni a videónál:

  1. Ellenőrzést adva! Ahogy a . Megjegyzem a videóban, egy percbe telt, mire rájöttem, hogy ez az oka annak, hogy a videó csak akkor jelent meg mobilon, ha meg is jelent.
  2. A videó inline lejátszása, mint például , ami megakadályozza, hogy a teljes képernyőn megjelenjen a mobilon, amint lejátszja.
  3. Folyékonyan és méretarányosan méretezve.
  4. Hol lehet otthont adni neki. A webszerver rendben van? CDN-n kell lennie? Használjon olyan médiagazdát, amely ilyen dolgokra specializálódott? A videóban felteszem a kényelmes Droplr-re, majd a CodePen Asset Hosting-ra, amely szintén hasznos, és végül a Cloudinary-re, mert olyan divatos dolgokat tud csinálni, mint az optimalizálás és a formátumkezelés.
  5. Győződjön meg arról, hogy a videó rohadt videónak tűnik-e. A mobil, ha használja , hogy segítségével a plakát: . Ellenkező esetben egy üres fehér semmit nem kap. Néha már önmagában is érdemes valamilyen segítőt használni.

Természetesen csak videókat csaphat be a YouTube-ra vagy bármi másra, és jó videokezelést kaphat semmiért. De a YouTube nem mindig megfelelő apró kis bemutató videókhoz, mint amilyenekkel itt foglalkoztam. Ráadásul nehezek, ezért lehet, hogy lustán tölti őket.

Végül a studio.cloudinary.com webhelyet nézzük meg. Meg tud csinálni néhány ügyes dolgot, például testreszabott lejátszót kínál és adaptív bitráta streaminget kínál, ami divatos, és valóban fontos dolognak tűnik a lehető legjobb video teljesítmény érdekében.