Forms & errors
A Dropdown Menu Has No Name
A screen reader announces the dropdown but not what it's for, so people can't tell which choice they're making.
select-nameWCAG 2.0Introduced in WCAG 2.0.Level AA — the minimum. Missing it blocks people outright.
- Status
- CriticalCritical — Someone can complete the task only with great difficulty or outside help.CurrentScanners run this rule today.
- Owner
- DesignDevContentTest
- Audit
- Automated+ManualA scanner finds it; a person confirms the fix.
Why it matters
A dropdown, or select, needs a name in code. That name is usually a visible label. Screen readers read it out so people know what to pick.
Without a name, people hear only "combo box" or the current option. They have to guess, or give up on the form.
Who it affects
| Who | What they experience | Impact |
|---|---|---|
| Screen reader users | They hear "combo box, Australia" with no clue whether it's their country, delivery address or billing address. | High impact |
| Voice control users | They can't say "click State" because the dropdown has no name to call it by. | High impact |
| Low-vision users (magnification) | With zoom on, a label floating far away or missing makes the dropdown's purpose hard to find. | Partial impact |
| Cognitive and neurodivergent users | If there's no visible label either, they must work out the question from the options alone. | Partial impact |
Business & product impact
| Area | Why | Impact |
|---|---|---|
| Legal | It fails WCAG 4.1.2 at Level A, the minimum. Complaints under Australia's Disability Discrimination Act point to WCAG, and EN 301 549 applies in Europe. | High impact |
| Conversion | Unnamed dropdowns for size, quantity, state or payment stop people finishing checkout and sign-up forms. | High impact |
| SEO | No real search benefit — don't sell it as one. | Low impact |
| Brand trust | A form people can't complete feels careless, and users remember it. | Moderate impact |
| Cost to fix | Usually a one-line fix. Fix it in the shared form component and every form improves. | High impact |
Fixing it in code
Connect a visible label
Don't
<span>State</span>
<select id="state">
<option>NSW</option>
<option>VIC</option>
</select>A screen reader says: “NSW, combo box”
Do
<label for="state">State</label>
<select id="state">
<option>NSW</option>
<option>VIC</option>
</select>A screen reader says: “State, NSW, combo box”
The for attribute ties the label's words to the dropdown.
A dropdown with no room for a visible label
Don't
<select>
<option>Sort by price</option>
<option>Sort by newest</option>
</select>A screen reader says: “Sort by price, combo box”
Do
<select aria-label="Sort products">
<option>Sort by price</option>
<option>Sort by newest</option>
</select>A screen reader says: “Sort products, Sort by price, combo box”
aria-label gives a name when a visible label truly won't fit.
Designer's handoff note
Give every dropdown a visible label that stays on screen, placed above or beside it.
Don't rely on the first option, like "Choose…", as the label. It disappears once someone picks.
Quick test
Tool
NVDA (opens in a new tab) (free for Windows)
Checklist
- Pass
- You hear what the dropdown is for, like "State, NSW, combo box".
- Fail
- You hear only the option and role, like "NSW, combo box".
Check these at the same time
- A custom input field has no name
aria-input-field-name - A form field has no label
label
What a green scan still misses
A scanner checks that a name exists. It can't tell whether the name is clear, or matches the visible label voice users will say.
Reference
- Rule ID
select-name- Raised by
- axe-core: “Select element must have an accessible name”
- WCAG
- 4.1.2 Name, Role, Value (opens in a new tab) · Level A · since WCAG 2.0
- Other standards
- EN 301 549 9.4.1.2 · RGAA 11.1.1
- Last reviewed
- 14 October 2026