Contenu du cours
HTML Ultime
HTML Ultime
Intégration de l'Audio et de la Vidéo pour un Contenu Multimédia Enrichi
Intégration audio
Vous pouvez utiliser l’élément <audio>
pour inclure des fichiers audio sur une page web. Considérons un exemple :
index.html
Dans cet exemple :
L’élément
<audio>
contient un élément<source>
, qui spécifie l’URL et le type de fichier de l’audio. Les formats couramment pris en charge sont MP3 et OGG ;L’attribut
controls
affiche les contrôles standards de lecture tels que lecture, pause et volume ;Si le navigateur de l’utilisateur ne prend pas en charge l’élément audio, un message de repli sera affiché.
Attributs supplémentaires couramment utilisés avec l’élément audio HTML :
autoplay
: démarre la lecture du fichier audio dès le chargement de la page ;loop
: fait boucler le fichier audio en continu ;muted
: coupe le son de l’audio par défaut ;volume
: spécifie le niveau de volume par défaut pour le fichier audio, allant de 0.0 (silencieux) à 1.0 (volume maximal).
Voici un exemple illustrant l’utilisation de tous ces attributs :
index.html
Intégration de vidéos
Vous pouvez intégrer des fichiers vidéo sur une page web en utilisant l’élément <video>
. Considérez l’exemple suivant :
index.html
Dans cet exemple :
L’élément
<video>
contient un élément<source>
, qui spécifie l’URL et le type de fichier de la vidéo. Les formats couramment pris en charge sont WebM, MP4 et OGG ;L’attribut
controls
affiche les contrôles de lecture standards ;Si le navigateur de l’utilisateur ne prend pas en charge l’élément vidéo, un message de remplacement sera affiché.
Les attributs couramment utilisés pour l’élément vidéo HTML incluent :
autoplay
: lance la lecture du fichier vidéo dès le chargement de la page ;loop
: fait boucler le fichier vidéo en continu ;muted
: coupe le son par défaut ;volume
: définit le niveau de volume par défaut pour le fichier audio, allant de 0.0 (silencieux) à 1.0 (volume maximal) ;poster
: indique l’URL d’une image à afficher comme vignette de la vidéo avant la lecture ;width
etheight
: définissent la largeur et la hauteur du lecteur vidéo en pixels.
Voici un exemple illustrant l’utilisation de tous ces attributs :
index.html
Remarque
De plus, de nombreuses bibliothèques JavaScript et API sont disponibles pour offrir des fonctionnalités supplémentaires de lecture et de manipulation de contenu vidéo sur le web.
Merci pour vos commentaires !