Path // www.yourhtmlsource.comReference → <track>

<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.

Clock 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 effects
    • descriptions - Textual descriptions of video content
    • chapters - Chapter titles for navigation
    • metadata - 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.