Making Video Accessible
Purpose
A primer on the web accessibility standards as they relate to video and making your videos compliant with those standards.
Introduction
Web accessibility refers to the practice of making websites usable for all people, particularly for those with disabilities, ensuring that everyone has equal access to all web content. The World Wide Web consortium (W3C) has established a set of guidelines known as Web Content Accessibility Guidelines, which attempts to provide a standardized and definitive set of rules for how to develop accessible online content.
Contents
Accessibility Guidelines
Let's first have a look at accessibility for the physically disabled. The W3C consortium has developed a set of guidelines known as the Web Content Accessibility Guidelines (WCAG 1.0).Introduced in 1999, these guidelines have since been widely adopted. A second version (WCAG 2.0) was published in December of 2008. Here's an overview of the current standards:
| WCAG 1.0 | WCAG 2.0 | |||||
| importance of the content | A | AA | AAA | A | AA | AAA |
| (closed) captions | X | X | X | X* | X | X |
| (closed) audio description | X | X | X | X* | X | X |
| full text alternative | X* | X | ||||
| sign language | X | |||||
* Choose at least one of the three options.
As you can see, according to the W3C, captions should be available for every published video. Captions are defined as "synchronized text equivalents of audio information in the same language as the audio, conveying not only speech content, but also non-speech information such as sound effects, music, laughter, and speaker identification and location." Closed captions must possess the option of being turned on or off at will. Non-closed (open) captions are printed on the video itself
The second important element is audio description, which makes video accessible to the visually impaired. It provides information about movements or actions that are important to comprehending the content and cannot be understood from the audio information alone. WCAG 1.0 always requires an audio description, while WCAG 2.0 permits you to replace it with a text description, but only for your least important content.
In addition to the requirements in the table above, two other generally accepted rules of thumb are:
- Don't enable autoplay (audio/video should be user-activated).
- Don't substitute HTML or text files for captions and audio descriptions
Note that the WCAG 1.0 contains less requirements for live video, decorative video and audio. Eric Velleman from Accessibility.nl has written a detailed document on this topic, which is also available in Dutch.
Accessibility Example
A properly accessible video should contain captions and an audio description. Let's see how this works in a real-life example. The video below shows an excerpt from ITV's Coronation Street, as shown on the RNIB website:
The video is played back in the JW Player for Flash. It's one of the few players that can display both closed captions and a closed audio description. Since it is built in Adobe's Flash, 95-99% of your visitors will be able to watch it.
Other accessibility features of this player are its keyboard controls (using the TAB and SPACE controls), its screen reader-labeled buttons and the full-screen button. Also, immediately above the player, hidden controls allow screen reader users to control the basic functionality of the player (Play / Mute / Stop).
This example uses the SWFObject JavaScript to detect if your visitors have the right Flash plugin (and JavaScript) installed. If so, the player is shown. If not, the player falls back to show an image linking to a downloadable video file. You can see a demonstration of how this works by turning off your browser’s JavaScript and reloading this page. Again, both the image and link have a text label for screen readers.
Example Codes
Here's the actual code used for the accessibility example above.
<p id="video">
<a href="corrie.mp4" title="download the MP4 excerpt">
<img src="corrie.jpg" width="470" height="300"
alt="a small excerpt from ITV's Coronation Street" />
</a>
</p>
<script type="text/javascript">
var sa = new SWFObject('player.swf','mpl','470','300','9');
sa.addParam("allowfullscreen","true");
sa.addParam("allowscriptaccess","always");
sa.addParam("seamlesstabbing","true");
sa.addParam("flashvars","file=/upload/corrie.flvℑ=/upload/corrie.jpg&captions.file=/upload/corrie.xml&audiodescription.file=/upload/corrie.mp3&plugins=captions-1,audiodescription-1");
sa.write('video');
</script>
And this is what the TimedText XML file looks like:
<tt xmlns="http://www.w3.org/2006/10/ttaf1">
<body>
<div xml:id="captions">
<p begin="00:08" end="00:10">- Nothing is going on.</p>
<p begin="00:10" end="00:12.5">You liar!</p>
<p begin="00:13" end="00:15">Are you?</p>
<p begin="00:17" end="00:20">Violet, please!<br/>- I am not your babe!</p>
<p begin="00:24" end="00:29">You stupid cow,<br/>look what you gone and done now, ay.</p>
<p begin="00:34" end="00:36">Vi, please.<br/>- Leave me alone!</p>
<p begin="00:36" end="00:38.5">- We need to talk.<br/>- Jason, are you deaf?!</p>
<p begin="00:41" end="00:43">What's going on?</p>
<p begin="00:43" end="00:45">Get out there and try to salvage this!</p>
</div>
</body>
</tt>
This setup can be tweaked a bit to further enhance the quality. Some methods are listed below:
- Use the captions.fontsize FlashVar to change the size of the captions font. (default = 14).
- Set the captions.back FlashVar to "true" to show a semitransparent backdrop that makes the captions more readable.
- Set the captions.state FlashVar to "false" to turn off the captions by default.
- Use the audiodescription.volume FlashVars to change the volume of the audio description (default = 90).
- Set the audiodescription.state FlashVar to "false" to turn off audio descriptions by default.
- Use a full JavaScript API to extend the hidden controls above the player.
- Use the upcoming Accessibility plugin to toggle on / off audio and captions.
Alternative Approaches
Besides the JW Player for Flash, Windows Media and QuickTime both support closed captions, with SAMI format and QTtext / 3GPP Text support, respectively. However, neither of these players support a closed audio description.
Note that the downloadable video file is an MP4. This is a high-quality format, which is very popular among mobile devices such as iPods / iPhones, the PSP and many smart phones. The MP4 format, though, isn't very useful if your target audience has older browsers or devices. It's fairly new and isn't supported by the default Windows installations. If your goal is to maximize reach, it’s best to encode any download as an MPG; its quality relative to file size is poor, but it’s able to play on just about everything. If you want to maximize accessibility even further, you can always hard code the captions and audio description into the video.
Authoring Tools
There's a whole range of applications that can transcode your original video files into any format you’d like (e.g. FLV, MP4, WMV, MPG). There’s a helpful list of links to some interesting applications in the Web Video Compression guide.
Unfortunately, there are only few applications available for creating closed captions:
- NCAM's magPIE (free, also for MAC)
- URUSoft's Subtitle Workshop (free)
- Manitu Group's Captionate ($60)
- VideoToolShed's SubBits subtitler ($199)
Both magPIE and Subtitle Workshop support the export of captions to W3C's TimedText (Flash), SMIL/QTtext (Quicktime) and ASX/SAMI (Windows Media). For Subtitle Workshop you need the TimedText output script (available from Naomi Spirit). Captionate, (intended for FLV video) can only export to W3C's TimedText, though it can also save captions as metadata.
Only magPIE has support for recording audio descriptions, but it’s somewhat limited. You cannot record to MP3 and cannot merge recorded samples or integrate them with a video. For now, a full-fledged audio/video suite, like Adobe's Premiere / Audition or Apple's iMovie/GarageBand, is needed for creating closed audio descriptions.