Content · Web Development · HTML

HTML select ARIA Role: Reference and Examples

Understand the select ARIA role, when it helps accessibility, a clear HTML example and mistakes to avoid.

1 views Published Oct 19, 2026 Updated Oct 19, 2026 Admin

You may see select while reading an accessibility specification. It is an abstract ARIA role: a category used to organize the role system, not a label that should be added to your website.

What this role means


An abstract category for widgets offering a choice.

Abstract roles explain relationships between real roles. A browser cannot turn role="select" into a useful accessible control, so the specification tells authors not to use it directly.

Use a real HTML element instead


<label for="color">Color</label>
<select id="color">
    <option>Blue</option>
</select>

Read the example


The snippet deliberately shows an actual HTML element or more specific widget, not the abstract role. That is the important lesson: choose markup that has a real purpose and behavior.

Never assign role="select"; prefer the select element or a concrete supported role.

When to use it


When you find select in a role hierarchy, ask which concrete role describes your interface. For example, an ordinary action is normally a <button>, and a page navigation area is a <nav>.

In an accessibility inspector, compare the accessible role and name with the visible content. The important goal is that both keyboard users and screen-reader users can understand the page.

Try it yourself


Put the example on a practice page and inspect it using your browser accessibility panel. If it includes interactive controls, reach them with Tab and check whether they work without a mouse. Explain whether the semantics come from native HTML or an explicit ARIA role.

Common Beginner Mistakes


  • Copying role="select" from a specification into a production webpage.
  • Never assign role="select"; prefer the select element or a concrete supported role.
  • Confusing the role announced by a screen reader with the behavior that the browser implements.

Key Takeaways


  • select is related to an abstract category for widgets offering a choice.
  • Never assign role="select"; prefer the select element or a concrete supported role.
  • Native HTML is the first choice; ARIA should clarify meaning, not replace working HTML.
Share this resourceSend this page to someone who may find it useful.