docs.rodeo

MDN Web Docs mirror

ARIA states and properties

{{AccessibilitySidebar}} 

This page lists reference pages covering all the WAI-ARIA attributes discussed on MDN.

ARIA attributes enable modifying an element’s states and properties as defined in the accessibility tree.

[!NOTE] ARIA only modifies the accessibility tree, modifying how assistive technology presents the content to your users. ARIA doesn’t change anything about an element’s function or behavior. When not using semantic HTML elements for their intended purpose and default functionality, you must use JavaScript to manage behavior, focus, and ARIA states.

ARIA attribute types

There are 4 categories of ARIA states and properties:

  1. Widget attributes

  2. Live region attributes

  3. Drag-and-Drop attributes

  4. Relationship attributes

Global ARIA attributes

Some states and properties apply to all HTML elements regardless of whether an ARIA role is applied. These are defined as “Global” attributes. Global states and properties are supported by all roles and base markup elements.

Many of the above attributes are global, meaning they can be included on any element unless specifically disallowed:

By “specifically disallowed,” all the above attributes are global except for the aria-label and aria-labelledby properties, which are not allowed on elements with role presentation nor its synonym none role.

States and properties defined on MDN

The following are the reference pages covering the WAI-ARIA states and properties discussed on MDN.

{{SubpagesWithSummaries}} 

See also

In this article

View on MDN