• Success Criterion 1.3.2
  • Conformance level A

Reading-Order Override That Contradicts the Actual Content Flow

1.3.2 — Meaningful Sequence

Scenario

Setting

A streaming music app's search results

What’s wrong

aria-flowto/reading-order overrides that contradict comprehension.

Example

<input type="search" id="q" aria-flowto="playAllBtn">
<ul id="results">
  <li>Song A - Artist X</li>
  <li>Song B - Artist Y</li>
</ul>
<button id="playAllBtn">Play all results</button>

Why it matters

Some assistive tech lets a user jump straight from the search box to the Play All button, skipping past the actual list of matching songs entirely.

How to test

Inspect aria-flowto or explicit reading-order overrides in DevTools: read the page with a screen reader and confirm the override actually improves rather than contradicts comprehension.

How to fix

Drop the aria-flowto override and let the natural document order, which already lists results before the button, control the reading sequence.

<input type="search" id="q">
<ul id="results">
  <li>Song A - Artist X</li>
  <li>Song B - Artist Y</li>
</ul>
<button id="playAllBtn">Play all results</button>

Outcome

Screen reader users now hear the matching songs before ever reaching the play all option.

Who is affected

Screen reader users relying on aria-flowto navigation can bypass the search results and never hear what they are about to play.

Learn more