Accessibility is an important element of web development, and with the ever-growing prevalence of video content, the necessity for captioned content is growing as well. WebVTT is a technology that solves helps with captioned content as a subtitle format that integrates easily with already-existing web APIs.
What is WebVTT?
Web Video Text Tracks Format (WebVTT) is a format for displaying timed text tracks (such as subtitles or captions) using the
<track> element. The primary purpose of WebVTT files is to add text overlays to a
<video>. WebVTT is a text based format, which must be encoded using UTF-8. Where you can use spaces you can also use tabs. There is also a small API available to represent and manage these tracks and the data needed to perform the playback of the text at the correct times.
A WebVTT file (.vtt) contains cues, which can be either a single line or multiple lines, as shown below:
WEBVTT 00:01.000 –> 00:04.000 Never drink liquid nitrogen. 00:05.000 –> 00:09.000 – It will perforate your stomach. – You could die.