Back to Info and Examples for Accessibility Insights for Web
aria-roles
ARIA roles must have valid values.
Why it matters
An ARIA role attribute can be added to an element to instruct assistive technologies to treat the element as something other than its native HTML element type.
For example, an <a> element with role="button" will be treated as a button, not as a link.
When an assistive technology encounters an element whose role attribute has an invalid value, it might ignore the element or respond to it in an unexpected way.
As a result, people who use assistive technologies might find the element difficult or impossible to detect or use.
How to fix
Provide a valid value for the role attribute:
- Make sure the value is spelled correctly.
- Make sure the role value exists. (For example, a common mistake is to specify the invalid role
"footer"when the valid role is"contentinfo".) - Make sure the role is not abstract.
For a list of valid ARIA roles, see Accessible Rich Internet Applications (WAI-ARIA) 1.1: Categorization of Roles. Note that some ARIA roles, while technically valid, are not widely supported by assistive technologies. This rule will fail when such roles are used.
Example
Fail
radiogroup have invalid role attribute values.
Assistive technologies can’t report their roles and might not report the elements at all.<h3 id="size">T-shirt size:</h3>
<div role="radiobutton" aria-checked="false" tabindex="0">Small</div>
<div role="radiobutton" aria-checked="false" tabindex="-1">Medium</div>
<div role="radiobutton" aria-checked="false" tabindex="-1">Large</div>
</div>
Pass
role attribute values. Assistive technologies can report the elements as radio buttons.<h3 id="size">T-shirt size:</h3>
<div role="radio" aria-checked="false" tabindex="0">Small</div>
<div role="radio" aria-checked="false" tabindex="-1">Medium</div>
<div role="radio" aria-checked="false" tabindex="-1">Large</div>
</div>
About this rule
This rule passes if ALL of the following are true:
- ARIA role is valid
- ARIA role is not an abstract role
- The role is widely supported in screen readers and other assistive technologies