0Pricing
HTML Academy · Lesson

Subtitles with track and WebVTT

Add captions and subtitles to video with track and .vtt files.

Captions and Subtitles

Video accessibility requires text alternatives for audio content:

  • Subtitles — dialogue transcription, assumes viewer can hear sounds
  • Captions — dialogue + descriptions of sounds (for deaf users)
  • Audio descriptions — describes visual content for blind users

The track Element

The <track> element links a subtitle/caption file to a video:

<video controls>
  <source src="tutorial.mp4" type="video/mp4">
  <track
    src="tutorial-en.vtt"
    kind="subtitles"
    srclang="en"
    label="English"
    default
  >
  <track
    src="tutorial-es.vtt"
    kind="subtitles"
    srclang="es"
    label="Spanish"
  >
</video>

All lessons in this course

  1. The audio Element src controls loop autoplay
  2. The video Element and Aspect Ratio
  3. The source Element for Multiple Formats
  4. Subtitles with track and WebVTT
← Back to HTML Academy