Elements must only use allowed ARIA attributes

Rule ID: aria-allowed-attr
Ruleset: axe-core 4.7
User Impact: Critical
Guidelines: WCAG 2.1 (A), WCAG 2.0 (A)
 

Build more accessible websites with axe DevTools Pro

Find and fix more issues with Intelligent Guided Tests™ by answering a series of simple questions about your page content. Free trial. No credit card needed.

Compliance Data & Impact

User Impact

Critical
▼
Minor
Critical

Disabilities Affected

  • Blind
  • Deafblind
  • Mobility

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)

WCAG Success Criteria [WCAG 2.1 (A)]

  • 4.1.2: MUST: Name, Role, Value

WCAG Success Criteria [WCAG 2.0 (A)]

  • 4.1.2: MUST: Name, Role, Value

How to Fix the Problem

ARIA explicitly defines which attributes are allowed for any given role and for every attribute, where that attribute may be used. The detailed information on each attribute can be found by looking at the documentation for each role and/or each attribute.

Specific Reference: For more information about which ARIA attributes may or should not be used by HTML element, see ARIA in HTML - Document conformance requirements for use of ARIA attributes in HTML opens in a new window and ARIA in HTML - Requirements for use of ARIA attributes to name elements opens in a new window.

General Reference: For general information about what ARIA can do, refer to the following external sources of information. ARIA is primarily to be used by web developers and programmers, because implementing ARIA usually requires JavaScript skills. Learning ARIA can also take a fair amount of time because of the complexities of the programming logic and also the nuances of ensuring that ARIA role-attribute combinations are valid.

Why it Matters

Using ARIA attributes in roles where they are not allowed can interfere with the accessibility of the web page. Using an invalid role-attribute combination will, at best, result in no effect on the accessibility of the application and, at worst, may trigger behavior that disables accessibility for entire portions of an application.

When ARIA attributes are used on HTML elements that are not in accordance with WAI-ARIA 1.1, they conflict with the semantics of the elements which can cause assistive technology products report nonsensical user interface (UI) information that does not represent the actual UI of the document.

Rule Description

Not all ARIA role-attribute combinations are valid. This Rule checks that each role is supplied with allowed attributes.

The Algorithm (in simple terms)

Checks that each element with an ARIA role uses only ARIA attributes allowed for that role.

Resources

Deque University Course Pages (subscription required)

Contribute to axe-core on GitHub

Other Resources

You may also want to check out these other resources.

Refer to the complete list of axe 4.7 rules.

Was this information helpful?

You have already given your feedback, thank you..

Your response was as follows:

Was this information helpful?
Date/Time feedback was submitted: