SiteLint documentation and guidelines

Audio or video should not play automatically

Description

Rule ID: autoplay-audio-video

This rule determines if media type audio (HTMLMediaElement) or iframe with allow="autoplay" or a URL that contains the autoplay parameter.

Purpose

The purpose of WCAG 1.4.2, known as Audio Control, is to ensure that users have control over audio content on web pages. Specifically, if any audio on a webpage plays automatically for more than 3 seconds, the website must provide one of two mechanisms:

  • A way to pause or stop the audio.
  • A way to control the audio volume independently from the overall system volume level.

This requirement is part of the broader principle of putting users in control of the content they interact with, emphasizing accessibility and user experience. It addresses potential issues where automatic audio could disrupt a user’s ability to effectively use the webpage, especially for those who might find such audio intrusive or distracting. By mandating controls for audio playback, WCAG 1.4.2 aims to enhance the accessibility of web content for all users, regardless of their hearing abilities or preferences regarding audio notifications and background sounds

How to fix it

To fix WCAG 1.4.2, follow these steps:

  • Avoid autoplay: the safest approach is to avoid autoplaying audio altogether. This prevents unexpected noise and ensures that users have control over when audio starts playing. If autoplay is necessary, ensure it does not exceed 3 seconds before providing a mechanism to pause or stop the audio.
  • Provide pause and volume controls: ensure that any audio that plays automatically for more than 3 seconds includes a mechanism to pause or stop the audio and a separate mechanism to control the audio volume independently from the overall system volume level. Ideally, both controls should be provided.
  • Ensure predictability and accessibility of controls:
    • Place audio controls at the top of the page if audio plays automatically to ensure immediate accessibility.
    • Make sure the controls can be operated using a keyboard alone, without needing a mouse. Conventional keyboard commands like the spacebar to stop playback and arrow keys to adjust volume should work when the keyboard focus is on the controls.
    • If using unconventional controls, provide clear instructions for their operation. Standard controls are generally more intuitive and expected by users.
  • Don’t play background audio: avoid playing background audio, especially if it contains speech, as it may violate WCAG 2.1 SC 1.4.7, which requires background sounds to be significantly quieter than foreground speech content. Removing background audio can also enhance the user experience by reducing distractions.