axe-core rule: select-name

Dropdown menus are missing accessible names

Fix reference | BarrierScan

What it is

A select element (dropdown) has no associated label, so users of assistive technology do not know what the dropdown chooses.

Who it blocks

Screen reader users hear "combo box" with no context. On product pages this often hides size or quantity selectors; in checkout it hides country or state pickers.

How to fix it

Associate a label element with the select using for and id attributes, or add an aria-label.

Example fix

<!-- Before -->
<select name="size">
  <option>Small</option>
</select>

<!-- After -->
<label for="size">Size</label>
<select id="size" name="size">
  <option>Small</option>
</select>

This is one of the barrier types BarrierScan checks for on every scan. Request a free accessibility scan to see whether it appears on your site, alongside the rest of the automated findings.