Skip to content
Learn Measure Blog Case studies About
On this page
  • How Lighthouse checks for invalid ARIA attributes
  • How to fix invalid ARIA attributes
  • Resources

[aria-*] attributes are not valid or misspelled

May 2, 2019 — Updated Sep 19, 2019
Appears in: Accessibility audits
On this page
  • How Lighthouse checks for invalid ARIA attributes
  • How to fix invalid ARIA attributes
  • Resources

Users of screen readers and other assistive technologies need information about the behavior and purpose of controls on your web page. Built-in HTML controls like buttons and radio groups come with that information built in. For custom controls you create, however, you must provide the information with ARIA roles and attributes. (Learn more in the Introduction to ARIA.)

Each ARIA role supports a specific subset of aria-* attributes that define the state and properties of that role. For example, the aria-selected attribute is used to indicate whether elements with option, tab, or similar roles are currently selected.

If an element's ARIA attribute is invalid, assistive technologies won't be able to interact with it as the developer intended.

How Lighthouse checks for invalid ARIA attributes #

Lighthouse flags invalid ARIA attributes:

Lighthouse audit showing ARIA attribute has invalid value

Lighthouse uses the states and properties from the WAI-ARIA specification to check that all ARIA attributes are valid. A page fails this audit when it contains an invalid attribute.

In the example Lighthouse audit above, the aria-checked attribute has been misspelled as aria-cheked, making it invalid.

The Lighthouse Accessibility score is a weighted average of all the accessibility audits. See the Lighthouse accessibility scoring post for more information.

How to fix invalid ARIA attributes #

Refer to the WAI-ARIA supported states and properties to see the full list of valid ARIA attributes. Make sure all ARIA attributes on your page match one of the defined states or properties.

Resources #

  • Source code for [aria-*] attributes are not valid or misspelled audit
  • ARIA attributes must conform to valid names (Deque University)
  • States and properties from the WAI-ARIA specification
Last updated: Sep 19, 2019 — Improve article
Return to all articles
Share
subscribe

Contribute

  • File a bug
  • View source

Related content

  • developer.chrome.com
  • Chrome updates
  • Web Fundamentals
  • Case studies
  • Podcasts
  • Shows

Connect

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • All products
  • Terms & Privacy
  • Community Guidelines

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies.