Avertissement juste: je ne suis pas un expert en la matière, je ne fais que jouer avec la vidéo sur le Web et résoudre certains problèmes que je rencontre lorsque je montre des clips vidéo dans des articles de blog.
J'ai un simulateur iOS dans cette vidéo et je mets une balise vidéo HTML dans un document HTML de base pour une vidéo rapide que j'ai enregistrée avec Kap.
Il y a beaucoup de choses à considérer avec la vidéo:
- Donner des contrôles! Comme dans
,. Notez dans la vidéo qu'il m'a fallu une minute pour réaliser que c'est pourquoi la vidéo n'est pas du tout apparue sur le mobile jusqu'à ce qu'elle le fasse. - Lecture de la vidéo en ligne, par exemple
, ce qui l'empêche de passer en plein écran sur mobile à la seconde où vous la jouez. - Dimensionner de manière fluide et avec des proportions.
- Où l'héberger. Votre serveur Web fonctionne-t-il bien? Doit-il être sur un CDN? Devriez-vous utiliser un hébergeur spécialisé dans ce genre de choses? Dans la vidéo, je le place sur Droplr, ce qui est pratique, puis sur CodePen Asset Hosting qui est également pratique, et finalement sur Cloudinary car il peut faire des choses fantaisistes comme l'optimisation et la gestion des formats.
- S'assurer que la vidéo ressemble à une putain de vidéo. Sur le mobile, si vous utilisez
, cela signifie une affiche:. Sinon, vous obtenez un rien blanc vierge. Parfois, cela vaut la peine d'utiliser une sorte d'aide.
Bien sûr, vous pouvez simplement lancer une vidéo sur YouTube ou autre et obtenir une bonne gestion vidéo pour rien. Mais YouTube n'est pas toujours adapté aux minuscules petites vidéos de démonstration comme je le faisais ici. De plus, ils sont lourds, vous pourriez donc envisager de les charger paresseusement.
En fin de compte, nous regardons studio.cloudinary.com. Il peut faire des choses intéressantes, comme offrir un lecteur personnalisé et faire du streaming à débit adaptatif, ce qui est sophistiqué et semble vraiment important pour les meilleures performances vidéo possibles.