Avec HTML5, il est possible depuis un certain temps d’ajouter du contenu vidéo à une page Web sans plug-in. HTML5 facilite également la fourniture de formats alternatifs pour votre contenu.
le vidéo> élément intègre du contenu multimédia dans la page. Dans sa forme la plus simple, il utilise le src attribut pour pointer vers le fichier source vidéo.
video src = contrôles "movie.webm"> / video>
Lorsqu'il est présent, l'attribut contrôles indique que le navigateur doit afficher son propre ensemble de contrôles d'interface utilisateur pour des fonctions telles que lecture / pause. Si vous créez un script pour votre propre ensemble de contrôles d'interface utilisateur, l'attribut fournit une solution de secours lorsque le script est désactivé dans le navigateur. Vous pouvez également fournir du contenu de secours pour les anciens navigateurs. Il peut s'agir de texte statique, d'un lien pour télécharger le fichier vidéo ou de conseils sur la mise à niveau vers un agent utilisateur compatible HTML5.
video src = Contrôles "movie.webm"> Contenu de secours pour les anciens navigateurs./video>
le affiche L'attribut peut être utilisé pour afficher une image de placement statique. Il y a encore des discussions sur la manière affiche est géré dans la spécification HTML5, mais pour l'instant c'est un attribut du vidéo> élément lui-même.
video src = "movie.webm" poster = "image.webp" Contrôles> Contenu de secours pour les anciens navigateurs./video>
le piste> element est un enfant du vidéo> élément utilisé pour pointer vers un fichier texte temporisé externe fournissant des informations supplémentaires pour la vidéo. Il utilise le gentil attribut pour spécifier le type d'informations à fournir.
- Les sous-titres (défaut): donne une traduction de dialogue lorsque le son n'est pas compris.
- Légendes: transcription audio complète lorsque le son n'est pas disponible ou ne peut pas être entendu par le spectateur.
- Descriptions: transcription de contenu visuel pour conversion en parole synthétique.
- Chapitres: fournit un mécanisme de navigation pour parcourir le contenu vidéo à travers une liste interactive dans l'interface utilisateur.
- Métadonnées: utilisé pour fournir un accès aux pistes à utiliser avec des scripts.
video src = "movie.webm" poster = "image.webp" contrôles> track kind = "captions" src = "captions.vtt"> Contenu de secours pour les anciens navigateurs./video>
Cet exemple utilise le format Web Video Text Tracks (Web VTT) pour fournir le légendes déposer. Web VTT vous permet de mapper un repère temporel sur un morceau de texte (transcrit à partir du dialogue sonore original). Tom Leadbetter explore plus en détail le Web VTT sur le site Web HTML5 Doctor.
le vidéo> L'élément est pris en charge dans tous les navigateurs actuels. Malheureusement, le soutien à la piste> élément et Web VTT est à la traîne. Cependant, les fournisseurs de navigateurs travaillent sur les deux, il ne faudra donc pas longtemps avant que nous ne soyons plus proches d'une vidéo HTML5 véritablement inclusive.
