- Success Criterion 3.3.2
- Conformance level A
- W3C reference F82
Multi-Part Field Like a Phone Number With No Text Label
3.3.2 — Labels or Instructions
Scenario
Setting
A podcast app's episode list
What’s wrong
A multi-part field (like a phone number split into boxes) has no text label at all — visually it 'looks like' a phone field but nothing says so.
Example
<input type="text" placeholder="Full name"> Why it matters
Everyone filling forms, especially people with cognitive disabilities and magnifier users.
How to test
Look at a multi-part field (e.g., phone number split into area code/number boxes): check for a text label — visual grouping alone with no label text fails.
How to fix
Give the field group a visible text label (and label each part programmatically).
<label for="name">Full name</label><input type="text" id="name" placeholder="e.g. Jane Smith">A persistent visible label survives once the user starts typing; a placeholder alone disappears.
Outcome
On a podcast app's episode list, this barrier is gone for everyone filling forms — they can complete the task without hitting this wall.
Who is affected
Everyone filling forms, especially people with cognitive disabilities and magnifier users.
Learn more
- Understanding Understanding document (opens in a new tab)
- Technique Related technique (opens in a new tab)
Related scenarios
- Icon-Only Search Field With No Accessible Label
- Placeholder Text Used as the Only Label, Vanishing on Input
- Required Input Format Never Stated Until After an Error
- No Indication of Which Fields on a Form Are Required
- Radio Button Group Missing Its Question or Prompt Text
- Field Instructions Placed After the Field They’re Meant to Explain