• Success Criterion 1.3.3
  • Conformance level A
  • W3C reference F14

Instructions That Identify Something Only by Shape or Position

1.3.3 — Sensory Characteristics

Scenario

Setting

A music streaming app's playlist screen

What’s wrong

Instructions identify something only by its shape or position. 'click the round button' or 'use the box on the right' — which is meaningless to blind users or when the layout changes.

Example 

<p>To shuffle your playlist, tap the round button in the top right.</p>
<button class="shuffle-btn"><svg class="icon-shuffle"></svg></button>

Why it matters

A blind user hears "tap the round button in the top right" but has no way to perceive shape or screen position, and cannot find the shuffle control at all.

How to test

Read the instruction text alone, without seeing the layout: 'the box on the right' or 'the round button' means nothing without sight — check for a text/name reference instead.

How to fix

Name the control with real text and reference that name in instructions, not its shape or screen position.

<p>To shuffle your playlist, tap the Shuffle button.</p>
<button class="shuffle-btn" aria-label="Shuffle"><svg class="icon-shuffle"></svg></button>

Outcome

A blind user hears "tap the Shuffle button" and finds it right away, by name.

Who is affected

Blind screen reader users, and anyone whose layout reflows in RTL locales or narrow screens, cannot locate a control described only by shape and position.

Learn more

Related scenarios