aria-roles

Description

You must use a valid value for the role attribute. If you use a misspelled, non-existent, or abstract ARIA role value, assistive technologies cannot determine the element’s purpose. Screen readers and other assistive technologies may ignore the element or process it incorrectly.

Check the spelling of your roles. Ensure the role corresponds to an existing ARIA role. Also, you must avoid abstract roles (such as roletype, command, or widget). The WAI-ARIA specification intends abstract roles only for internal categorization, not for use in content by developers.

This rule aligns with WCAG Success Criterion 4.1.2 (Name, Role, Value), which requires that the role of every user interface component must be programmatically determinable.

Examples

In the following incorrect example, the role attribute value is input, which is a non-standard value. Assistive technologies will not recognize this role.

In the following corrected example, the role value is valid. Assistive technologies now correctly identify the link as an interactive button.

How to fix

To fix violations of the aria-roles rule, follow these steps:

1. Check spelling: Verify that the value assigned to the role attribute is spelled correctly according to the WAI-ARIA specification.

2. Ensure validity: Confirm the role is an existing, concrete ARIA role (e.g., alert, dialog, navigation).

3. Avoid abstract roles: Do not use abstract roles like roletype, command, input, or widget.

References

• WCAG Success Criterion 4.1.2: Name, Role, Value {:target=”_blank”}