Can each automatically triggered sound be controlled by the user?
A screen reader is speaking. If your page plays a sound when loading, a blind user hears two voices simultaneously: theirs and yours. In most cases, they understand neither one nor the other. This is the reason for this criterion.
Criterion 4.10 requires that a sound triggered automatically be controllable by the user. Three conditions allow validation: the sequence lasts 3 seconds or less, or a device (pause button, stop, mute) is present in the page or on the sound element and is keyboard accessible, or the volume of the sequence is adjustable independently of system volume.
The elements involved are numerous: <audio>, <video>, <object>, <embed>, <bgsound>, but also any JavaScript code using the Web Audio API or a .play() call on loading. If your homepage opens with ambient music, a video in autoplay with sound, or a voice announcement, this criterion applies.
The control button must be placed before the sound element in the tab order. A button at the bottom of the page that the user reaches after thirty seconds of sound does not fulfill the criterion's intent.
Un test to detect automatic sound playback
Control of automatically triggered sound
- Load the page in a browser with system sound enabled.
- Note if a sound is triggered automatically (music, video with audio, voice announcement, jingle).
- If no sound is triggered automatically, the test does not apply.
- If a sound is triggered, verify that at least one of the following conditions is met:
- The total duration of the sound sequence is 3 seconds or less.
- A button (pause, stop or mute) is present in the page or on the sound element, and it is keyboard accessible.
- A volume control specific to the sequence is available, independent of system volume.
- If at least one condition is met, the test is validated.
- Elements to inspect:
<audio autoplay>,<video autoplay>,<object>,<embed>,<bgsound>, and any JavaScript call to.play()or the Web Audio API on loading.
Examples
❌ Non-compliant : Video in autoplay with sound, without any control
<video src="intro.mp4" autoplay loop>
<p>Your browser does not support the video tag.</p>
</video>The video starts with sound when the page loads, with no button to pause or mute it. The loop attribute means the sequence never stops. A screen reader user hears both the video's audio track and their screen reader's voice simultaneously, without being able to stop either one without leaving the page. Failure F93.
✅ Compliant : Automatic audio with accessible control button before the element
<button type="button" id="ctrl-jingle" aria-pressed="true"
onclick="var a=document.getElementById('jingle'); a.paused ? (a.play(), this.setAttribute('aria-pressed','true')) : (a.pause(), this.setAttribute('aria-pressed','false'))">
Pause welcome music
</button>
<audio id="jingle" src="jingle.mp3" autoplay></audio>The button is placed before the <audio> element in the DOM, thus before it in the tab order. Its label is explicit. The aria-pressed attribute informs screen readers of the current state (sound active or paused). The user can regain control without traversing the entire page.
✅ Compliant : Short automatic audio — duration condition met
<!-- 2-second jingle on loading, no additional control required -->
<audio src="notification-2s.mp3" autoplay></audio>A 2-second sequence meets the duration condition (≤ 3 seconds). No control button is required. The disruption is too brief to mask the screen reader's speech for long. Note: without the loop attribute, the sequence stops on its own.
Tips and pitfalls
⚠️ The muted attribute does not cover the criterion
<video autoplay muted> mutes sound by default, but if you add an "Unmute sound" button, the video can resume with audio without a pause control available. Always test the full journey: unmute the sound, then verify that a button allows stopping it. In audits, this pattern represents one of the most frequent non-compliances on showcase pages.
⚠️ The control button placed after the sound element in the DOM
Technique G170 recommends placing the control at the beginning of the page, before the triggering element. A "Mute" button located at the page footer forces keyboard users to traverse all interactive elements while the sound plays. It is technically a control present, but the criterion's intent is not respected.
⚠️ Sounds triggered by JavaScript without visible media tag
The Web Audio API and calls to new Audio('file.mp3').play() in a DOMContentLoaded listener are automatic sounds under the criterion's meaning. They have no native browser control. Inspect the JavaScript code: search for .play() and AudioContext in scripts loaded on startup. If a sound is detected, a control button must be added manually to the page.
⚠️ Sound triggered only on user action: out of scope
If sound only starts in response to an explicit click on a "Play" button, criterion 4.10 does not apply. This is technique G171. The audit pitfall: some scripts trigger .play() on a mouseover or focus event, which is not an explicit playback action. Verify that playback only initiates on an intentional click or keydown.
💡 The "independent volume" condition is rare but valid
The third condition — controlling the volume of the sequence independently of system volume — is rarely implemented but perfectly valid. A volume slider on a custom audio player is sufficient. It is useful when you prefer not to offer a stop button (for example for background sound that the user can only reduce to zero).
Frequently asked questions
How does RGAA criterion 4.10 apply to autoplay muted videos?
Yes, as long as it remains muted. If you offer an "Unmute sound" button that restarts the video with audio, a pause or stop control must then be available. In summary: autoplay muted without activatable sound is compliant; autoplay muted with sound option is compliant only if a control accompanies the reactivated audio.
How to audit RGAA criterion 4.10 on automatic sound in practice?
Load the page with system sound enabled and note everything that plays immediately. In developer tools, Network tab, filter on "Media" to identify audio or video files loaded at startup. Inspect the DOM: look for autoplay on <audio> and <video>. Also search for .play() in scripts. For each detected sound, confirm that one of the three conditions is met.
How does the RGAA 4.10 3-second rule apply: per loop or total duration?
To the total duration of the sequence triggered automatically. An audio file of 2 seconds is compliant. Music of 2 seconds played in a loop (loop) is not, because the overall sequence far exceeds 3 seconds. The loop attribute is a systematic alert signal in audits.
What role do native <video controls> play in RGAA 4.10 compliance?
Yes. If the tag bears the controls attribute, the browser displays a playback bar with pause button and volume control, keyboard accessible. Without controls, no native control is rendered and one must be implemented manually. This is the simplest and most robust solution to satisfy the criterion.
How does RGAA criterion 4.10 apply to notification sounds in a web application?
Yes, as soon as a sound is triggered automatically on load or on an event without explicit user action. A notification sound played on incoming message in a web messenger falls under the criterion if the user has not activated playback. A user preference allowing to disable these sounds in the application's settings is a valid way to satisfy the "control device" condition.