Elements in the focus order need a role appropriate for interactive content

Log in (Premium content) Request a demo

Rule Description

User input elements must have appropriate roles, whether native HTML or a custom widget, to convey to screen reader users their meaning when landed on and given focus. If a custom widget, appropriate ARIA role values must be used instead of abstract roles in order to correctly expose the purpose of the element.

The Algorithm, in Simple Terms

Checks all interactive elements in the focus order to ensure that the role value is valid and appropriate, whether native HTML or a custom ARIA widget.

Why this is Important

Elements in the focus order need a role appropriate for interactive content so that screen reader technology can communicate that information to users.

If interactive content elements do not have appropriate roles, the role will not be able to perform the accessibility function intended by the developer.

How to Fix the Problem

Ensure all elements in the focus order have an appropriate role="", and if a custom widget, that they correspond to valid ARIA roles.

Ensure all device-independent user input methods have appropriate roles to enable interaction with form content.

Compliance Data & User Impact

User Impact: Serious
Disabilities Affected:
  • Blindness
  • Deafblindness
  • Mobility/Dexterity
Issue Type:
  • Deque Experimental
  • Deque Best Practice
WCAG Success Criteria:
  • Not applicable
Section 508 Guidelines:
  • Not applicable

Related Deque University Course Pages

Related Deque Code Library Examples

Other Related Resources

Additional Information

Relevant Technologies:
  • HTML 4
  • HTML 5
  • ARIA
Relevant Custom Widget Type(s):
  • Textbox (ARIA)
  • Radio Button/Radio Group (ARIA)
  • Option (ARIA)
  • Modal Dialog (ARIA)
  • Form Validation
Test Reliability: Automated testing is possible, with high accuracy
Rule ID: focus-order-semantics