04 Current HTML5 subtitle support

In the current proposed HTML5 standard the <video> tag contains a <track> tag used for supplying a link to a subtitle file.

At the time of writing (April 2012) there is no support for providing subtitles using the <track> tag in HTML5 enabled websites displaying video. While the <track> tag remains unsupported by all current browsers a few developers have created JavaScript libraries (JavaScript is code which makes web pages very interactive) that add the required functionality to the <track> tag.

The proposed subtitling format for HTML5 video is WebVTT which is based on SubRip .SRT and there are JavaScript libraries available that support it.

WebVTT (.vtt) has a lot of support and will likely remain the format used for subtitling HTML5 video into the future. This is a positive outcome as it is possible to demonstrate the correct way to create and incorporate subtitles that work now and remain relevant when the HTML5 specification is completed.

Browser and device subtitle requirements

While JavaScript libraries solve the problem of the lack of subtitle support in modern HTML5 browsers it does not completely solve the problem for:

• older browsers using the Flash based fall back
• mobile devices (iOS and Android*), even though they have HTML5 enabled browsers installed.

To create subtitles that will work in all situations there needs to be 3 different subtitle formats provided. These formats are:

• WebVTT (.vtt) for modern web browsers on a desktop or laptop computer
• SubRip SRT (.srt) for use with iOS devices
• XML (.xml) for Flash fall back and an Android solution.

It is possible to create the SubRip format and convert that into the other formats using freely available web based tools.

Subtitle software

Subtitles are required to make video accessible to all users.  The process of making subtitles involves creating an initial subtitle in the SubRip SRT format then converting it into WebVTT and XML for Flash.
The WebVTT format is used by HTML5 to provide subtitles and is relatively new. Consequently, tools that export directly to this format are hard to find. Currently WebVTT only works on desktop and laptop computers running modern browsers with a JavaScript solution.

WebVTT validator : http://quuz.org/webvtt/

The table below provides information on free subtitling options which have been tested in this project.  These options can be used to create subtitles which can be converted to WebVTT format for HTML5 web pages.

Subtitling tool	Creates WebVTT	Operating system	Ease of use 1= difficult, 5= easy	Free	Web based solution	Time to subtitle 3min video
Subtitle Workshop	No	Windows only	4	Yes	No	1 hour
MAGpie	No	Windows only	2	Yes	No	2 hours
Aegisub	No	Windows and Mac	1 – could not get it to work effectively	Yes	No	Unsuccessful
Universal Subtitles/Amara	No	Any operating system with a web browser.	5	Yes	Yes	20 minutes

*No software tools that could support export to the WebVTT format were identified.


The two software programs which standout as being of the most use are discussed below.

Subtitle Workshop
This tool plays MP4 encoded files. This is a feature which is unavailable in other tools.  While it is easy to use the interface, it is not completely intuitive and requires regular access to the help files. While Subtitle Workshop does not directly create WebVTT (.vtt) files, the conversion process from the .srt type is exceedingly easy.

Universal Subtitles/Amara
This is excellent and is by far the easiest subtitling tool available. There are 3 simple steps that are explained clearly at the beginning of each step via short video instructions. This tool is the simplest tool for the beginner to use.

Universal Subtitles/Amara is a web based tool. This means that the video being worked on will need to be uploaded to a video hosting site (ie YouTube, Vimeo, your personal website) in order to apply subtitles. The video can then be removed once subtitling has been completed.

During the project trials, Universal Subtitles/Amara was used to create the initial subtitles file. The file was then converted into a WebVTT file later. In the future it is expected that WebVTT will become the standard for delivering subtitles and there will be more software available that will export directly to WebVTT. 

Related posts:

Accessible HTML5 video for all
How to create a basic HTML5 webpage
Fall back to Flash
Current HTML5 subtitle support
Subtitle creation process
Link subtitles to video
Making subtitles work now
A Flash solution
Making it work now, on an Android device
Making it work now, on an Apple device
Thoughts on HTML5 video and subtitles - conclusion