- Success Criterion 2.5.3
- Conformance level A
Visible Label Text Reordered or Broken Apart in the Name
2.5.3 — Label in Name
Scenario
Setting
A streaming music app's search results
What’s wrong
Name contains label but broken apart/reordered so speech engines fail matching in practice, or label string interrupted by injected hidden words *before* it completes.
Example
<button aria-label="Find">Search</button> Why it matters
Voice-control users and screen-reader users who depend on spoken names matching visible text.
How to test
Compare the visible label to the accessible name character by character: if the label text is broken apart, reordered, or interrupted by injected hidden words, it fails matching.
How to fix
The accessible name must contain the exact visible label text.
<button aria-label="Search">Search</button>The accessible name must contain the visible label text so voice-control users can activate it by what they see.
Outcome
On a streaming music app's search results, this barrier is gone for voice-control users and screen-reader users who depend on spoken names matching visible text — they no longer have to work around this.
Who is affected
Voice-control users and screen-reader users who depend on spoken names matching visible text.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Accessible Name That Doesn’t Match the Control’s Visible Label
- Visible Label Text With No Accessible Name Behind It
- ARIA Label Naming a Completely Different Action Than Shown
- Accessible Name Built From an Icon Instead of Visible Text
- Translated ARIA Label That Doesn’t Match the Visible Language
- ARIA Reference Pointing to the Wrong Element for a Name