<track>
The <track> element specifies text tracks for <video> and <audio> elements. These tracks can include subtitles, captions, descriptions, chapters, or metadata. The track content is typically provided in WebVTT format (.vtt files). This element is essential for making media content accessible to users who are deaf, hard of hearing, or need translations.
This page was last updated on 2025-11-17
Syntax
<video controls>
<source src="movie.mp4" type="video/mp4">
<track src="captions.vtt" kind="captions" srclang="en" label="English">
</video>
The element is a void element (self-closing) and does not have a closing tag. It must be a child of a <video> or <audio> element and should appear after all <source> elements. Multiple track elements can be included for different languages or track types.
Attributes
- src (required) - URL of the track file, typically a .vtt (WebVTT) file.
- kind - Type of text track:
subtitles- Translations of dialogue (default)captions- Transcription of dialogue plus sound effectsdescriptions- Textual descriptions of video contentchapters- Chapter titles for navigationmetadata- Machine-readable data not displayed to users
- srclang - Language of the track text (required for
kind="subtitles"). - label - User-readable title for the track, shown in the player's track selection menu.
- default - Boolean attribute indicating this track should be enabled by default.
- Global attributes - Supports standard global attributes.
Examples
Video with Multiple Language Subtitles
<video controls width="640">
<source src="documentary.mp4" type="video/mp4">
<track src="subs-en.vtt" kind="subtitles" srclang="en" label="English" default>
<track src="subs-es.vtt" kind="subtitles" srclang="es" label="Spanish">
<track src="subs-fr.vtt" kind="subtitles" srclang="fr" label="French">
</video>
Video with Captions and Chapters
<video controls>
<source src="lecture.mp4" type="video/mp4">
<track src="captions.vtt" kind="captions" srclang="en" label="English Captions" default>
<track src="chapters.vtt" kind="chapters" srclang="en" label="Chapters">
</video>
Audio with Descriptions
<audio controls>
<source src="podcast.mp3" type="audio/mpeg">
<track src="transcript.vtt" kind="captions" srclang="en" label="Transcript">
</audio>
When to Use
Use the <track> element when:
- Providing subtitles for non-native speakers
- Adding closed captions for deaf or hard-of-hearing users
- Including audio descriptions for visually impaired users
- Creating chapter markers for long videos
- Adding metadata for programmatic access
- Making video content accessible (often legally required)
WebVTT file format basics:
- Plain text file with .vtt extension
- Starts with "WEBVTT" on the first line
- Contains timed cues with text
- Supports basic styling and positioning
Example WebVTT content:
WEBVTT
00:00:01.000 --> 00:00:04.000
Welcome to our tutorial.
00:00:05.000 --> 00:00:08.000
Today we'll learn about HTML5 video.