Category: captions

Captions and YouTube

Video captions are obviously necessary for users with a hearing impairment to access the audio content. But there are more reasons as to why captions are important including:

  • Speakers or headset is broken.
  • Too loud an environment such as train or yelling children.
  • Too quiet an environment such as a library or when spouse is sleeping.
  • Helps those with cognitive disability (or language is not native).
  • SEO

Correcting YouTube automated captions

So you have a video on YouTube. The automatic captions are a valiant effort but not nearly understandable enough, yet. To correct, you can use a great tool embedded right in YouTube. Note: If you recall, a few years ago, one had to download the caption file, edit, and then upload.

YouTube CC

Below are the basic steps to get you started on editing the captions. This is a very nifty and convenient tool, but best for sighted mouse users. Also keep in mind that there are different ways to reach the editing mode, and it may change (as it has already from the referenced articles below).

  1. Go to a YouTube video you own (while logged in of course).
  2. Click the CC (“Subtitles and CC”) icon just under the video.
  3. If you don’t have a custom caption file:
    1. Click the “Add new subtitles or CC” menu button.
    2. Select the language. You may be asked to set the default language at this point.
  4. If you have a caption file:
    1. Under the Published heading, click the language of the caption file to edit.
    2. Click the blue Edit button.
  5. Edit away!

Resources for YouTube Captions


Accessibility for HTML5 Video, Controls and Captions

As you probably know, HTML5 provides a video tag for rendering a video natively in a web browser (and audio as well). But unfortunately, as of now, HTML5 video isn’t very accessible, yet.


Browser support for native HTML5 video controls varies widely. No browsers but Opera provide keyboard-accessible controls. Well, you can also start/stop with keyboard in Firefox 3.6. To make the controls keyboard-accessible calls for JavaScript. This is fairly easy to do, and is quite fun to implement for web geeks like me. But nonetheless it requires JavaScript which obviously isn’t good for devices and browsers which don’t have JavaScript available.

Note that in Firefox 3.6 and below, disabling JavaScript also disables the native video controls! To bring up a contextual menu, you must do a mouse right-click in the video.


The HTML5 spec has a great plan for captions, timed tracks. It accommodates well for different types of roles (captions, subtitles, descriptions) and multiple languages. The format of the caption text files themselves may be similar to the time stamp format WebSRT (Web Subtitle Resource Tracks). Sadly, there is no support for timed tracks in any browser at this time. The code would go inside the video tag and would look something like this:

Fortunately, in the meantime, Bruce Lawson of Opera provides a method for JavaScript HTML5 video captions. The solution uses JavaScript to grab caption text from span tags with time attributes and place the text over a video. Neat! If JavaScript is unavailable, the caption text appears below the video.

About the Codecs/Containers

Not directly related to accessibility, but let’s take a look at the supported video codec/containers of the major browsers. First off, and not surprisingly, Internet Explorer doesn’t support any HTML5 video. And the word is that IE9 will only support WebM if it’s installed on the operating system.

So to cover all major browsers today, you’ll need to encode to an OGG and MP4 file, and then do a Flash video fall-back for IE. Here’s a great table on current support codecs/containers.

Video support in shipping browsers
Codecs/container IE Firefox Safari Chrome Opera iPhone Android
Theora+Vorbis+Ogg · 3.5+ · 5.0+ 10.5+ · ·
H.264+AAC+MP4 · · 3.0+ 5.0+ · 3.0+ 2.0+
WebM 9* 4 · 5.0+ 10.6+ · ·

It appears WebM will be the codec of the future, but again, it is only partially supported at this time.

Related links

Podcast #77: Interview with Terrill Thompson

Dennis speaks with Terrill Thompson, technology accessibility specialist at DO-IT, a program at the University of Washington.

Download Web Axe Episode 77 (Interview with Terrill Thompson)

[transcript of podcast 77]

In addition to Terrill’s background and DO-IT, topics of discussion include:

Roundup: Accessibility Links on Twitter

Here’s a list of some great links relating to web accessibility going around Twitter last week.