L'attribut src est une des solutions possibles pour définir l'URL du fichier vidéo à télécharger et à inclure dans la page. Bien sûr si la vidéo est un fichier situé dans un des dossiers de votre site, il faut utiliser une URL relative pour faire le lien.

Quand vous allez tester le code HTML suivant, vous obtiendrez une page dans laquelle s'affiche la 1ère image de la vidéo, mais rien de plus ne se passe et aucun moyen n'est fourni pour déclencher la lecture.

L'attribut src tout seul n'est pas suffisant pour que la vidéo soit lue . On doit ajouter d'autres attributs pour la lecture à la demande de l'utilisateur (attribut controls) ou automatique (attribut autoplay).

Pour que la vidéo soit fonctionnelle il faut ajouter l'attribut controls qui va forcer l'affichage d'une barre d'icônes permettant de contrôler différentes actions : play, pause, début, etc.

controls est un attribut booléen : c'est la présence de l'attribut qui définit sa prise en compte. Si une valeur est affectée elle n'aura aucune influence. Une erreur commune est d'écrire controls="false" : la barre de contrôle sera affichée malgré la valeur false.

Avec HTML seul on ne peut pas agir sur cette barre de contrôle. Il n'est pas possible de modifier sa position, sa couleur, la forme ou la présence de tel ou tel bouton. Chaque navigateur l'affiche comme il veut, à l'endroit où il veut, et celà peut changer d'une version à une autre, ou même selon les dimensions de la vidéo.

Les attributs width et height permettent de donner la largeur et la hauteur de la vidéo. La valeur de ces attributs est simplement un nombre entier qui exprime la hauteur ou la largeur en pixels. Il ne faut surtout pas spécifier d'unité (le pixel) car la valeur ne serait pas prise en compte.

Comme pour les images, et pour les même raisons, je vous conseille de toujours donner les dimensions des vidéos.

L'attribut poster accepte comme valeur l'URL d'une image à afficher tant que la vidéo n'est pas en mode lecture.
L'utilisation de poster est intéressante à partir du moment où la lecture de la vidéo n'est pas certaine (l'utilisateur n'est pas interessé) ou que la page contient de nombreux autres médias à télécharger (images, autres vidéos, audio). Dans ce cas le navigateur affichera l'image d'attente et passera au téléchargement de la vidéo uniquement quand ça sera nécessaire. Si il n'y a pas de poster, le navigateur téléchargera le plus souvent le début de la vidéo pour avoir quelque chose à afficher plutôt qu'un espace noir.

L'attribut autoplay est un attribut booléen qui déclenche la lecture automatique de la vidéo dès qu'elle est possible.

Si vous ne voulez pas que l'utilisateur ait le contrôle de la vidéo, mais que la vidéo soit lue malgré tout, vous pouvez ne pas mettre d'attribut controls et uniquement un attribut autoplay.

L'attribut loop est un attribut booléen qui déclenche la lecture en boucle de la vidéo.

L'attribut preload définit comment sera chargée la vidéo si on ne veut pas utiliser le système mis en place par le navigateur pour la gestion des chargements.
L'attribut preload peut avoir 3 valeurs.

• preload="none" : le téléchargement de la vidéo commencera seulement quand l'utilisateur démarrera la lecture.
• preload="auto" : le téléchargement de la vidéo commencera dès que la page sera affichée. Celà peut conduire à surcharger le réseau et le serveur si la vidéo est de grande taille et pas regardée.
• preload="metadata" : le navigateur va seulement télécharger les métadonnées de la vidéo comme sa durée, sa taille, ses dimensions, liste des pistes, etc.