Introduction de l'article de wulin.com (www.vevb.com): Aperçu de la vidéo HTML 5.
1 Introduction vidéo
Citez le texte d'introduction de mon document traduit "Embed Audio and Video dans les pages HTML5": Aujourd'hui, le seul moyen fiable d'intégrer des vidéos sur des pages Web et de les voir tous les utilisateurs, quel que soit leur navigateur ou leur système d'exploitation est d'utiliser Flash. Cela nécessite le plugin Adobe Flash et combine les balises <objet> et <embed>.
La plupart des utilisateurs ont déjà des plugins flash installés (en fait, environ 95% des utilisateurs d'Internet ont une certaine version de Flash), mais les supporters HTML 5 font pression pour une norme vidéo ouverte qui ne nécessite aucun plugins. C'est l'idée apportée à la nouvelle balise de HTML 5 <video>, qui fournit un moyen d'intégrer des vidéos (et d'interagir avec eux) sans avoir besoin de plugins privés comme Flash.
Malheureusement, la vidéo n'est pas si simple. Non seulement le navigateur doit comprendre la balise <video>, mais aussi un encodage et un décodeur nécessaires pour lire des vidéos. La solution évidente est uniquement pour les créateurs de spécifications HTML 5 de choisir un codec vidéo et de laisser chaque fabricant de navigateur l'exécuter.
Quoi qu'il en soit, c'est ce que vous recommandez. En même temps, c'est aussi le fusible qui provoque le chaos. Le débat sur une variété de codecs est déjà très ennuyeux, mais le plus tragique est que les fabricants de navigateurs ne peuvent pas atteindre une fin unifiée. Apple est réticent à utiliser le codec Ogg Theora proposé, mais Opera et Mozilla ne veulent pas non plus payer les frais de licence en raison de leurs navigateurs chargés du codec H.264. Google prend en charge les deux, et Microsoft est loin derrière le débat car il n'a pas du tout prévu de prendre en charge les éléments vidéo HTML 5.
Face à l'impasse des fabricants de navigateurs, le dictateur bien intentionné HTML 5 Ian Hickson lui a serré la main et a dit putain. Par conséquent, il n'y a pas de codec de codage vidéo spécialement nommé ou spécifié dans la spécification HTML 5. Ok, cite ici.
La situation est que Microsoft est finalement piégé, mais tragiquement, il ne prend en charge H.264 que dans IE 9. En même temps, Google a finalement publié le format de l'encapsulation vidéo open source WebM et le format de codage vidéo VP8 lors de la conférence d'E / S. Opera, Mozilla et Chrome ont annoncé qu'ils prendront en charge VP8, et IE a annoncé qu'un support (un plug-in est nécessaire, mais si je me souviens bien, l'une des visions de HTML5 est de quitter le plug-in de navigateur, qui est vraiment tragique pour Microsoft).
Apple a décidé de ne pas prendre en charge VP8. Jobs estime que VP8 n'est pas aussi bon que H.264 en termes de qualité ou d'efficacité et ne peut pas répondre aux exigences de ses produits. De plus, les dernières nouvelles montrent que VP8 peut également impliquer des problèmes de brevet (si le brevet est vraiment violé, l'opéra et Firefox ignoreront probablement VP8 immédiatement).
Cela dit, en fin de compte, si vous souhaitez utiliser la balise <video> sur la page, vous devez considérer trois situations: celles qui prennent en charge Ogg Theora ou VP8 (si rien n'arrive à cette chose) (Opera, Mozilla, Chrome), ceux qui prennent en charge H.264 (Safari, c'est-à-dire 9, Chrome), ceux qui ne soutiennent pas (IE6, 7, 8).
Eh bien, comprenons maintenant les vidéos HTML 5 à partir d'un niveau technique, y compris l'utilisation de balises <video>, les propriétés multimédias et les méthodes que les objets vidéo peuvent utiliser et les événements multimédias.
2 Utilisation de la balise vidéo
La balise vidéo contient plusieurs attributs tels que SRC, affiche, précharge, marque automatique, boucle, commandes, largeur, hauteur, etc., ainsi qu'une balise utilisée en interne <source>.
En plus de la balise <Source>, la balise vidéo peut également inclure le contenu renvoyé lorsque aucune des vidéos spécifiées ne peut être lue.
2.1 Attribut SRC et attribut d'affiches
Pouvez-vous imaginer à quoi sert l'attribut SRC. Comme la balise <MG>, cette propriété est utilisée pour spécifier l'adresse de la vidéo.
L'attribut d'affiche est utilisé pour spécifier une image et l'afficher lorsque les données vidéo actuelles ne sont pas valides (image d'aperçu). Les données vidéo non valides peuvent être due au chargement de la vidéo, cela peut être dû au fait que l'adresse vidéo est erronée, etc.
2.2 Attribut de précharge
Cette propriété peut également être utilisée par son nom, qui est utilisée pour définir si la vidéo est préchargée. Il existe trois valeurs facultatives pour les attributs: aucun, les métadonnées et l'auto. Si cette propriété n'est pas utilisée, la valeur par défaut est automatique.
Aucun: pas de préchargement. L'utilisation de cette valeur de propriété peut être que le fabricant de pages estime que l'utilisateur ne s'attend pas à cette vidéo ou réduit les demandes HTTP.
Métadonnées: partiellement préchargée. L'utilisation de cette valeur d'attribut signifie que le fabricant de pages estime que l'utilisateur ne s'attend pas à cette vidéo, mais fournit à l'utilisateur des métadonnées (y compris la taille, la première image, la liste des pistes, la durée, etc.).
Auto: tous préchargés.
2.3 Attributs de jeu automatique
Un autre attribut qui connaît son utilisation selon le nom. La propriété de jeu automatique est utilisée pour définir si la vidéo est automatiquement lue et est une propriété booléenne. Lorsqu'il apparaît, cela signifie la lecture automatique et le supprimer signifie qu'il ne joue pas automatiquement.
Notez que les valeurs de l'attribut booléen dans HTML ne sont pas vraies et fausses. L'utilisation correcte consiste à utiliser cet attribut pour représenter True dans la balise. À l'heure actuelle, l'attribut n'a pas de valeur ou sa valeur est toujours égale à son nom (ici, la lecture automatique est <video AutoPlay /> ou <video AutoPlay = AutoPlay />); Bien que cet attribut ne soit pas utilisé dans la balise pour représenter False (ici, la lecture automatique est <video />).
2.4 Attributs de boucle
Il est clair en un coup d'œil que l'attribut de boucle est utilisé pour spécifier si la vidéo est lue, et c'est aussi un attribut booléen.
2.5 Contrôles Attribut
La propriété Controls est utilisée pour indiquer au navigateur que le fabricant de pages n'utilise pas de scripts pour générer le contrôleur de lecture, et le navigateur nécessite le navigateur pour activer sa propre barre de contrôle de lecture.
La barre de contrôle doit inclure le contrôle de la pause de lecture, le contrôle de progression de la lecture, le contrôle du volume, etc.