HTML5 : les nouveaux attributs vidéo au crible Contenu de repli pour les navigateurs qui ne prennent pas en charge <video>

Vous aurez remarqué que l'élément <video> possède une balise d'ouverture et une balise de fermeture. Il y a deux raisons à cela. Tout d'abord, d'autres éléments ont été introduits comme enfants de l'élément <video>. En particulier, les éléments <source> et <track>. Nous y reviendrons.

Ensuite, tout ce qui est stipulé à l'intérieur de l'élément <video> et qui ne se trouve pas à l'intérieur de l'un des éléments enfants spécifiques de l'élément <video> est considéré comme un "contenu de repli". On parle de "repli" dans la mesure où les navigateurs web qui ne prennent pas en charge les éléments HTML5 <audio> et <video> les ignoreront tout en continuant d'afficher leur contenu, si bien qu'on dispose ainsi d'une sorte de mécanisme de compatibilité arrière. Les navigateurs qui prennent en charge les éléments HTML5 <video> et <audio> n'affichent pas ce
contenu. Le Listing 2.4 en fournit un exemple.

Listing 2.4 : Incorporer de la vidéo MPEG-4 en HTML5 avec un contenu de repli

<video src="HelloWorld.mp4">
     Votre navigateur ne prend pas en charge l'élément vidéo HTML5.
</video>

Lorsque nous incluons ce contenu dans l'exemple précédent et que nous l'exécutons dans un navigateur ancien, nous obtenons le résultat de la Figure 2.2.

Vous pouvez ajouter n'importe quel balisage HTML à l'intérieur de l'élément
<video>, dont des éléments <object> et <embed>. Vous pouvez donc fournir une solution de repli avec un lecteur Flash de remplacement lié à un fichier MP4 ou FLV, ou avec une applet Java Cortado pour Ogv. Ces plug-ins vidéo ne prennent pas en charge l'API JavaScript de l'élément HTML5 <video>, mais vous pouvez récupérer des bibliothèques JavaScript qui émulent une partie des fonctionnalités de l'API JavaScript et fournissent une solution de repli dans bien des situations. Parmi les exemples de bibliothèques, on peut citer mwEmbed, Video for Everybody!, Sublime Video ou VideoJS.

Vous remarquerez que dans le Listing 2.4, avec un navigateur web HTML5
moderne qui ne prend pas en charge le MP4 mais accepte Ogg ou WebM, ce n'est pas le contenu de repli qui s'affiche. Vous devez utiliser du JavaScript pour capturer l'erreur de chargement et induire l'action appropriée. Nous verrons comment le faire au Chapitre 4. Cela n'a véritablement de sens que si vous comptez utiliser un unique format multimédia et souhaitez capturer les erreurs pour les navigateurs qui ne le prennent pas en charge. Si vous acceptez de prendre en charge plusieurs formats, il existe une autre solution de balisage, qui ne recourt pas à l'attribut @src mais consiste à lister toutes les ressources alternatives pour un unique élément <video> avec l'élément <source>. Nous y reviendrons au cours d'une sous-section ultérieure.