Techniques for WCAG 2.0

Skip to Content (Press Enter)

This document is a draft, and is designed to show changes from a previous version. It is presently showing added text,changed text,deleted text,[start]/[end] markers,and Issue Numbers.

Hide All Edits   |   Toggle Deletions  |   Toggle Issue Numbers   |   Toggle [start]/[end] Markers   |   Show All Edits

Changes are displayed as follows:

-

FLASH9: Applying captions to prerecorded synchronized media

Applicability

Adobe Flash-based Content

This technique relates to:

User Agent and Assistive Technology Support Notes

See User Agent Support for Flash for general information on user agent support.

Description

The objective of this technique is to provide an option for people who have hearing impairments or otherwise have trouble hearing the sound and dialogue in synchronized media to be able to choose to view captions as an alternative to audio information. With this technique all of the dialogue and important sounds are provided as text in a fashion that allows the text to be hidden unless the user requests it. As a result they are visible only when needed. This can be achieved using the FLVPlayback and FLVPlaybackCaptioning components. Note: when using FLVPlayback skins the closed caption button is accessible by default, but if implementing custom skins authors need to test to verify that the button is accessible.

Examples

Example 1: Adding a timed text caption file to Flash

  1. Use an external tool (such as Magpie or a simple text editor) to create a timed Text captions xml file. Stop and play the video content, and for each relevant part of audio information (including speech, important background noises and event sounds) include the start and end time code as well as the textual alternative. Tools like Magpie have advanced features to make this process easier, whereas a text editor requires you to read the timecodes from your media player and include them in the XML as illustrated in the sample captions document below

  2. In Flash, create a new instance of the FLVPlayback component on your stage, and set its contentPath value to your flv video file using the 'Component inspector' or 'Parameters' panel.

  3. Set the 'Skin' parameter to use a skin which includes the CC (closed captions) button.

  4. From the components list also create an instance of the FLVPlayback captioning component. In the 'Component inspector' panel set its 'Source' parameter to the name of your timed text xml file. The captions will automatically placed at the bottom of the player's frame.

Example Code:

<?xml version="1.0" encoding="UTF-8"?>
<tt xml:lang="en" xmlns="http://www.w3.org/2006/04/ttaf1"
  xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling">
  <head>
    <styling>
      <style id="defaultSpeaker" tts:backgroundColor="black"
        tts:color="white" tts:fontFamily="SansSerif" tts:fontSize="12"
        tts:fontStyle="normal" tts:fontWeight="normal"
        tts:textAlign="left" tts:textDecoration="none"/>
      <style id="defaultCaption" tts:backgroundColor="black"
        tts:color="white" tts:fontFamily="Arial" tts:fontSize="12"
        tts:fontStyle="normal" tts:fontWeight="normal"
        tts:textAlign="center" tts:textDecoration="none"/>
    </styling>
  </head>
  <body id="thebody" style="defaultCaption">
    <div xml:lang="en">
      <p begin="0:00:00.20" end="0:00:02.20">If there were nothing in
        our universe</p>
      <p begin="0:00:02.20" end="0:00:05.65">the fabric of space-time
        would be flat.</p>
      <p begin="0:00:05.65" end="0:00:08.88">But add a mass, and
        dimples form within it.</p>
      <p begin="0:00:16.61" end="0:00:19.84">Smaller objects that
        approach that large mass</p>
      <p begin="0:00:19.84" end="0:00:23.41">will follow the curve in
        space-time around it.</p>
      <p begin="0:00:32.64" end="0:00:36.84">Our nearest star, the
        sun, has formed such a dimple</p>
      <p begin="0:00:36.84" end="0:00:38.00">and our tiny planet
        Earth</p>
      <p begin="0:00:38.00" end="0:00:41.50">goes along for the ride
        in the curve of its dimple</p>
      <p begin="0:00:41.50" end="0:00:43.80">staying in orbit around
        the sun.</p>
      <p begin="0:00:45.67" end="0:01:55.00"/>
    </div>
  </body>
</tt>

This is demonstrated in working example of Adding a timed text caption file to Flash. The working example of Adding a timed text caption file to Flash is available.

Resources

Resources are for information purposes only, no endorsement implied.

http://ncam.wgbh.org/invent_build/web_multimedia/tools-guidelines

http://www.buraks.com/captionate/

http://www.w3.org/AudioVideo/TT/

Tests

Procedure

Watch all video content displayed by your Flash movie. Ensure that:

  1. Captions are available for all audio content, either turned on by default or as a user preference.

  2. The captions properly describe all audio information contained in the video.

Expected Results

If this is a sufficient technique for a success criterion, failing this test procedure does not necessarily mean that the success criterion has not been satisfied in some other way, only that this technique has not been successfully implemented and can not be used to claim conformance.