médias void Auto-fermant

<track>

Spécifie une piste textuelle synchronisée pour video ou audio : sous-titres, légendes, descriptions, chapitres ou métadonnées.

Description

L’élément <track> est void et spécifie une piste textuelle au format WebVTT associée à une <video> ou un <audio>. Il permet d’ajouter des sous-titres, des légendes pour les sourds et malentendants, des descriptions audio, des chapitres ou des métadonnées synchronisées.

Syntaxe

<video controls src="video.mp4">
  <track kind="subtitles" src="sous-titres.fr.vtt" srclang="fr" label="Français" default>
</video>

Exemples

Sous-titres multilingues :

<video controls src="conference.mp4" width="1280" height="720">
  <track kind="subtitles" src="conf.fr.vtt" srclang="fr" label="Français" default>
  <track kind="subtitles" src="conf.en.vtt" srclang="en" label="English">
  <track kind="subtitles" src="conf.es.vtt" srclang="es" label="Español">
</video>

Légendes pour malentendants + chapitres :

<video controls src="tutoriel.mp4">
  <track kind="captions" src="captions.fr.vtt" srclang="fr" label="Sous-titres (malentendants)" default>
  <track kind="chapters" src="chapters.vtt" label="Chapitres">
</video>

Attributs spécifiques

AttributTypeDescription
kindenumType de piste : subtitles (sous-titres), captions (légendes), descriptions (descriptions audio), chapters (chapitres), metadata.
srcURLURL du fichier WebVTT. Obligatoire.
srclangstringCode de langue BCP 47 (ex. fr, en-US). Obligatoire pour kind="subtitles".
labelstringLibellé visible dans le menu de sélection de pistes.
defaultbooleanPiste activée par défaut si aucune préférence n’est définie.

Notes

subtitles vs captions : subtitles traduit les dialogues pour les non-natifs ; captions transcrit également les sons non verbaux (musique, effets) pour les personnes sourdes ou malentendantes. Pour l’accessibilité (WCAG 1.2.2), utiliser captions.

Format WebVTT : fichier texte .vtt avec des cues synchronisées. Exemple minimal :

WEBVTT

00:00:01.000 --> 00:00:04.000
Bonjour et bienvenue dans ce tutoriel.

Support navigateurs

Chrome23+ · Firefox31+ · Safari6+ · Edge12+