References

Beginner-friendly references for web development, with live, editable examples.

The HTML <track> tag

Element All modern browsers Updated
Quick answer

The HTML <track> element adds a timed text track to <video> or <audio> — captions, subtitles, descriptions or chapters from a WebVTT file. Set its kind, srclang and label.

Overview

The <track> element is a void element nested inside a <video> or <audio> that supplies a timed text track in WebVTT format — captions, subtitles, descriptions, chapters or metadata.

The kind attribute states what the track is: captions (speech plus important sounds, for deaf users), subtitles (a translation for viewers who do not speak the language), descriptions (narrating the visuals), chapters, or metadata. Use srclang for the language, label for the name shown in the menu, and default to enable a track automatically.

Captions are essential, not a nicety: they convey speech and meaningful sounds to deaf and hard-of-hearing users, help people in sound-off environments, and make the content searchable. Every video with speech should ship with a captions track.

Syntax

<track kind="captions" src="caps.vtt" srclang="en" label="English" default>

Attributes

The <track> element supports the following attributes, in addition to the global attributes available to every HTML element.

Attribute Value Description
default A boolean attribute — present or absent. Enables a media track by default.
kind subtitles captions descriptions chapters metadata Sets the kind of a media text track.
label A string of label text. Titles a media text track.
src A URL pointing to the resource. Specifies the URL of an embedded resource.
srclang A BCP 47 language tag, e.g. en. Sets the language of a media text track.

Example

Live example 
<video controls width="320">
  <track kind="captions" src="captions.vtt" srclang="en" label="English" default>
</video>

Best practices

  • Provide a captions track for every video that contains speech.
  • Set kind, srclang and label so the track is identified correctly in the menu.
  • Use default to turn on the most relevant track automatically.
  • Author the track in WebVTT and keep captions in sync with the audio.

Accessibility

A captions <track> is the primary way to make video accessible to deaf and hard-of-hearing users. Provide accurate, synchronized captions, and add audio descriptions where visual information is essential.

Frequently asked questions

How do I add captions to a video?
Nest a <track kind="captions" src="captions.vtt" srclang="en"> inside the <video>.
What is the kind attribute on track?
It says what the track is — captions, subtitles, descriptions, chapters or metadata.
What is the difference between captions and subtitles?
Captions include speech and important non-speech sounds for deaf users; subtitles translate the dialogue for viewers who do not speak the language.
What format does a track file use?
WebVTT (a .vtt file), which lists timed cues for the text track.
tr u