Web checklist

Checkpoint 1.4b: Audio control

If any audio on a Web page plays automatically for more than 3 seconds, either a mechanism is available to pause or stop the audio, or a mechanism is available to control audio volume independently from the overall system volume level.


Rationale

Individuals who use screen reading software can find it hard to hear the speech output if there is other audio playing at the same time. This difficulty is exacerbated when the screen reader's speech output is software-based (as most are today) and is controlled via the same volume control as the sound. Therefore, it is important that the user be able to turn off the background sound. Note: Having control of the volume includes the ability to silence the volume.

Required development and unit test techniques


To comply with this checkpoint, you must meet at least one of the following techniques. These techniques are defined in WCAG 2.0 Level A Success Criterion 1.4.2 (link resides outside of ibm.com).

  1. Auto turn off: Play a sound that turns off automatically within three seconds.
  2. Control at top: Provide a control near the top of the Web page that turns off sounds that play automatically.
  3. User request: Play sounds only when a user requests them.

Note: The examples presented in the techniques are not exhaustive. They are meant to illustrate the spirit of this checkpoint.

General examples

  1. Auto turn off: Play a sound that turns off automatically within three seconds.

    To comply with this technique, you must implement the following example.

    General example 1

    Ensure the sound is completed within three seconds and doesn’t continue to play in a cycle. For example:

  2. Control at top: Provide a control near the top of the Web page that turns off sounds that play automatically.

    To comply with this technique, you must implement the following example.

    General example 2

    A Web page contains embedded media (audio, video, etc.) that begins to play once the page opens. The page has (Pause and / or Stop) buttons that give the user control over media.

    Note for iOS platform: Apple recommends using the HTML5 audio and video elements for mobile Safari audio and video content. However, these elements use the browsers' native players, and the controls on the players are not keyboard accessible. Therefore, developers must use the HTML5 audio/video API, JavaScript and CSS to implement keyboard focusable controls. An example implementation of an accessible HTML5 video/audio player can be found in Chapter 6 of Pro HTML5 Accessibility: Building an Inclusive Web. Use this link to register for access to the Pro HTML5 Accessibility document.

  3. User request: Play sounds only when a user requests them.

    To comply with this technique, you must implement the following example.

    General example 3

    A bird watching society Web page has a looping background sound of a woodpecker singing. There are also sounds of wind, trees and other birds. The sounds do not start automatically. Instead, the Web content provides a link at the top of the page to allow the user to start the sounds manually. The button is labeled (Turn sounds on). After selecting the button, the user can hear the sounds and then they are presented with an option to turn the sounds off. The Web page also contains a link to a sound file containing the sounds of the birds. The link text is Hear the song of the pileated woodpecker (mp3).

    Required unit tests for all general development techniques

    Perform the following unit test using a Web syntax analysis tool or a screen reader.

 

Recommended development techniques

Although you do not have to implement the recommended technique in order to comply with this checkpoint, you should review the technique because it can improve the accessibility and usability of the application.

  1. Provide a site-wide preference to turn off audio in addition to provide a control near the top of the Web page that turns off sounds that play automatically.

Example of recommended techniques

  1. Provide a site-wide preference to turn off audio in addition to provide a control near the top of the Web page that turns off sounds that play automatically.

    The JKRowling.com site contains a set of accessibility tools at the top of the page that allow the user to customize their experience, including muting all sounds.

JKRowling.com web site contains accessibility tools at the top. These tools include open site help, mute sounds, pause movements, and magnify daily news.


©2013 IBM Corporation

Last updated January 1, 2013.

W3C Recommendation 11 December 2008: http://www.w3.org/TR/WCAG20/ (link resides outside of ibm.com)
Copyright 1994-2009 W3C (Massachusetts Institute of Technology, European Research Consortium for Informatics and Mathematics, Keio University), All Rights Reserved.