Mobile Accessibility Guidelines - Audio & Video

Autoplay must not


Audio must not play automatically unless the user is made aware this will happen or a pause/stop/mute button is provided.


Audio in AV and interactive content can be disruptive for screen reader users because it can conflict with and speak over the screen reader audio. Unexpected audio may also distress users with cognitive or sensory sensitivity. Movement from automatically playing content can also disrupt the experience for people with low vision or cognitive impairments.

Users should be given a choice to opt in for auto-playing content audio. Where a pause/stop/mute button is provided instead, it must be fully and immediately accessible.

Where play automatically continues to the next content item, this must be indicated in an accessible way, with a choice to opt out and sufficient time to do so.

User preferences should persist.


iOS

iOS subtly lowers the sound of the audio track in order to allow users to hear the screenreader (known as audio ducking). While this goes some way to helping with audio conflicts its is not sufficient.

iOS Example (Objective-C)

Provide a button or link along with the controls for the audio playback that will start the audio. Do not call the play method directly after loading the audio in app unless creating the audio when initiated by the user.

  UIButton *playButton = [UIButton buttonWithType:UIButtonTypeCustom];
  [playButton setTitle: NSLocalizedString(@"Play commentary" forState:UIControlStateNormal];
  …
  AVAudioPlayer *audioPlayer = [[AVAudioPlayer alloc] initWithContentsOfURL:url error:nil];
  [audioPlayer prepareToPlay];

Android

By default, TalkBack will automatically decrease the volume of playback when audio begins. However, where possible, make sure that audio is initiated by the user. Provide a control that starts/stops audio when the new screen/page is loaded. Consider forewarning new users.

Android Pass Example

  <Button
  android:id="@+id/pause_button"
  android:src="@drawable/pause"
  android:contentDescription="@string/Pause commentary"
  … />

HTML

Provide a separate control to allow users to initiate the audio themselves when the page/screen is initially opened

HTML Pass Example

<button aria-label="Pause commentary">Pause</button>

Testing

Procedures

  1. Locate a screen with audio content.
  2. Locate media content that plays automatically.
  3. Check one of the following is true:
    • the containing page does not play audio automatically when it loads
    • the user has been warned media will autoplay and a control is provided to stop or pause the audio.

Outcome

Either of the following checks are true:

  • Media content does not play automatically.
  • The user is pre-warned that media will automatically play and there is a control to stop or pause.