Who this affects
The dropdown has no accessible name, so its purpose is not announced.
How to fix it
Bind a <label for="…"> to the select, or add aria-label.
Effort Low · ~10 min
Before and after
Fails
<select name="sort_by" id="SortBy">
<option>Featured</option>
</select>Passes
<label for="SortBy">Sort products by</label>
<select name="sort_by" id="SortBy">
<option>Featured</option>
</select>Where this sits in the standard
| WCAG success criterion | Level | EN 301 549 clause |
|---|---|---|
| 4.1.2 Name, Role, Value | A | 301-549, 9.4.1.2 |
EN 301 549 clause 9 applies these criteria to web content. The published version referenced by the European Accessibility Act is V3.2.1, which incorporates WCAG 2.1 level A and AA. More on the standard.
How to check it by hand
Click each field's visible label. If focus does not move into the field, the label is not bound to it. Then tab through the form with a screen reader running and confirm every field announces its own purpose, not just its type.
Automated testing settles roughly a third of the WCAG success criteria. This rule is one an automated tool detects reliably — but a clean automated result is not proof of conformance.
Reference
Deque's technical write-up for this rule: select-name
See whether your site trips this rule
Paste a URL. We open it in a real browser, dismiss the cookie wall and run the full EN 301 549 rule set. No account, no card.