WebVTT (Web Video Text Tracks), saved as .vtt, is the subtitle and caption format of the web. It’s the only text track format the HTML5 video element supports, so websites, online courses and many web video players use it. It’s based on SRT, with additions for positioning, styling and speaker names.
What a VTT file looks like
WEBVTT
00:00:01.000 --> 00:00:04.000
Hello, and welcome.
00:00:04.500 --> 00:00:07.250 align:start position:10%
<v Ana>This line is spoken by Ana.Every file starts with WEBVTT. Each cue has a start and end time with a dot before the milliseconds, optional settings after the times, and the text. Cue numbers are optional, and hours can be left out for short videos (01:02.500).
VTT compared with SRT
| VTT | SRT | |
|---|---|---|
| Header | WEBVTT required |
None |
| Milliseconds | Dot: 02.500 |
Comma: 02,500 |
| Cue numbers | Optional | Required |
| Positioning | Yes (line, position, align) | No |
| Speaker names | <v Name> tags |
No |
| Comments and styles | NOTE and STYLE blocks | No |
| Supported by | Browsers, web players | Almost everything |
Adding VTT captions to a web page
<video controls src="talk.mp4">
<track kind="captions" src="talk.vtt" srclang="en" label="English" default>
</video>Use kind="captions" when the text includes sounds and speaker names for viewers who can’t hear the audio, and kind="subtitles" for translations of the dialogue.
Opening and editing VTT files
VTT files are plain text and open in any text editor; save them as UTF-8, which the standard requires. For desktop players, video editors and TVs that don’t accept VTT, convert it to SRT, the most widely supported subtitle format.