HTML5 : les nouveaux attributs vidéo au crible L'élément vidéo
Comme indiqué au chapitre précédent, il existe en fait trois formats de fichier que les éditeurs doivent prendre en considération lorsqu'il s'agit de cibler tous les navigateurs qui prennent en charge l'élément HTML5 <video> (voir Tableau 2.1).
Puisqu'il n'existe pas de codec de base établi (voir l'historique au Chapitre 1), nous proposerons des exemples pour tous ces formats.
Comme il est d'usage en matière de programmation logicielle, nous commencerons par un exemple "Hello World". Voici les trois exemples simples qui incorporent de la vidéo en HTML5 :
Listing 2.1 : Incorporer de la vidéo Ogg en HTML5
<video src="HelloWorld.ogv"></video>
Listing 2.2 : Incorporer de la vidéo WebM en HTML5
<video src="HelloWorld.webm"></video>
Listing 2.3 : Incorporer de la vidéo MPEG-4 en HTML5
<video src="HelloWorld.mp4"></video>
Nous avons placé ces trois portions de code sur une même page web, ajouté des contrôles (la barre de transport en bas ; nous y reviendrons plus loin) et fixé la largeur à 300 pixels afin de proposer une comparaison directe entre les cinq principaux navigateurs. La Figure 2.1 présente le résultat.
Firefox affiche les vidéos Ogg et WebM et produit une erreur pour les vidéos MPEG-4. Opera réagit de façon similaire, sans rien afficher pour les vidéos MPEG-4. Safari et Internet Explorer n'affichent rien pour les vidéos Ogg et WebM et n'affichent que les vidéos MPEG-4. Chrome affiche les trois formats.
claire en matière d'affichage. Nous analyserons plus en détail les fonctionnalités et les différences ci-après. Il ne s'agissait ici que d'un premier aperçu.