Rättvis varning: Jag är ingen expert på dessa saker, jag spelar bara med video på webben och tar upp några problem jag har när jag visar upp videoklipp i blogginlägg.
Jag har en iOS-simulator uppe i den här videon och lägger in en HTML-videotagg i ett grundläggande HTML-dokument för en snabb video som jag spelade in med Kap.
Det finns många saker att tänka på med video:
- Att ge det kontroller! Som i,
. Observera i videon det tog mig en minut att inse att det var därför videon inte dykt upp alls på mobilen förrän den gjorde det. - Att spela upp videon inline, som
hindrar den från att gå i fullskärm på mobilen när du spelar den. - Storlek på den flytande och med bildförhållande.
- Var det är värd. Är din webbserver bra? Ska det finnas på ett CDN? Ska du använda en medievärd som är specialiserad på sådana saker? I videon plockar jag den på Droplr vilket är bekvämt, sedan på CodePen Asset Hosting vilket också är praktiskt och i slutändan på Cloudinary eftersom det kan göra snygga saker som optimering och formathantering.
- Se till att videon ser ut som en jävla video. På mobil, om du använder
, det betyder en affisch:. Annars får du ett tomt vitt ingenting. Ibland är det ensamt värt att använda någon form av hjälpare.
Naturligtvis kan du bara chucka video på YouTube eller vad som helst och få bra videohantering för ingenting. Men YouTube är inte alltid rätt för små små demonstrationsvideor som jag hade att göra med här. Dessutom är de tunga, så du kanske tittar på att lat laddar dem.
I slutändan tittar vi på studio.cloudinary.com. Det kan göra några snygga saker, som att erbjuda en anpassad spelare och göra adaptiv bithastighetsströmning, vilket är snyggt och verkar verkligen som en viktig sak för bästa möjliga videoprestanda.