• Success Criterion 1.1.1
  • Conformance level A
  • W3C reference F67

Long Image Description That Skips the Image’s Actual Content

1.1.1 — Non-text Content

Scenario

Setting

A ride-hailing app's trip booking screen

What’s wrong

The long description provided for an image doesn't actually convey the same information as the image itself.

Example

<img src="route-map.png" alt="Route map" longdesc="app-about.html">
<!-- app-about.html describes the company, not the actual route -->

Why it matters

A rider confirming their pickup route can't tell whether the map shown matches the trip they booked, since the linked description talks about something else entirely.

How to test

Open the linked long description (or expandable detail) and compare it point-by-point to the image: if it leaves out information the image conveys, it fails.

How to fix

Point the description at content that actually explains the image, restating its real detail. A long description only helps if it actually describes the image it's attached to.

<img src="route-map.png" alt="Route map" aria-describedby="route-detail">
<p id="route-detail" class="visually-hidden">Route from Main St to Oak Ave, 12 minutes, 3 turns, no highways.</p>

Outcome

A rider confirms the exact route and turn count before the car arrives, matching what a sighted rider sees on the map.

Who is affected

Blind and low-vision riders confirming trip details before a driver arrives depend on that description matching the map.

Learn more