1.2.3 Audio Description or Media Alternative (Prerecorded)

WCAG 2.2 · 1.2.3 A Perceivable

What it requires

For prerecorded video that has a synchronised soundtrack, you must provide one of two things so that people who cannot see the screen still get the information shown only in the picture:

  • An audio description — added narration, fitted into the natural pauses in dialogue, that conveys important visual detail (actions, characters, on-screen text, scene changes) not already spoken in the soundtrack; or
  • A full media alternative for time-based media — a correctly sequenced text document that describes both the visual and the audio content, equivalent to a screenplay or annotated transcript.

You only need to provide a description when there is visual information not already available in the existing audio track. This is a Level A criterion; the related 1.2.5 (Level AA) requires the audio description specifically. It applies to prerecorded media only — live media is out of scope here.

Failing this criterion mainly excludes people who are blind or have low vision and anyone using a screen reader or listening rather than watching. Without a description they miss meaning carried purely by the picture — an actor pointing at an unspoken label, a chart, a location caption, or silent action — making the video confusing or unusable. A clean text alternative also helps people who are deafblind (via a refreshable braille display) and people who simply prefer or need to read.

How to detect it

Checks for prerecorded audio description / media alternative
Check How Catches a failure when…
Visual-only info Watch with the screen hidden; note anything you no longer understand. Meaning is lost because it was shown but never spoken.
Description provided Look for an audio-described track, a description toggle, or a linked full text alternative. Neither an audio description nor a media alternative exists.
Alternative quality Read the transcript/screenplay end to end. It omits visual content or is out of sequence with the action.
Reachable & operable Keyboard and screen reader: find and activate the alternative or described track. The control or link is hidden, unlabelled, or keyboard-inoperable.
Automated tools Run axe / similar. They cannot judge this — automation flags missing tracks at best; human review is required.

How to fix it

  1. Review the video and list every piece of information conveyed only visually.
  2. If gaps exist, choose a remedy: produce an audio-described version (narration in the dialogue pauses) or write a full media alternative.
  3. Expose the remedy to users — offer the described track via the player, or link a clearly labelled text alternative next to the video.
  4. Make sure the link or control is keyboard-operable and has an accessible name.
  5. Re-test with the screen hidden to confirm nothing essential is now missing.
<video controls>
  <source src="talk.mp4" type="video/mp4">
  <!-- Described audio track as an alternative source -->
  <track kind="descriptions" src="talk.vtt" srclang="en" label="Audio descriptions">
</video>

<!-- Or a full media alternative -->
<a href="talk-transcript.html">Full text alternative for this video</a>

Copy-paste tests

Automated coverage

There is no fully automated axe-core rule that confirms this criterion: a tool cannot tell whether a video carries pre-recorded audio-only content, nor judge whether an audio description or text alternative is accurate. It needs manual review using the console check and steps below.

Run this in the browser console

console-1-2-3.js 
// Read-only: list videos and their description/alternative cues for review
const vids = [...document.querySelectorAll('video')];
console.table(vids.map(v => ({
  src: v.currentSrc || v.src || '(source element)',
  descTracks: v.querySelectorAll('track[kind="descriptions"]').length,
  captionTracks: v.querySelectorAll('track[kind="captions"]').length,
  hasNearbyTranscriptLink: !!v.closest('section,article,body')
    ?.querySelector('a[href*="transcript" i],a[href*="alternative" i]')
})));
vids.forEach(v => { v.style.outline = '3px solid magenta'; });
console.log('Review each video manually — see steps below.');

What to check manually: watch each video and confirm any information shown only visually (action, on-screen text, who is speaking) is conveyed by an audio description or an equivalent text alternative — and that the alternative is complete and accurate, not just present.