roles and attributes help screen readers
provide missing information about an element.
For these roles and attributes to make sense,
role supports a specific subset of
(see ARIA roles definitions).
Lighthouse reports any mismatches between roles and
Key Term: ARIA attributes let you modify the way HTML elements are represented to assitive technologies like screen readers. Learn more in this Introduction to ARIA.
How Lighthouse finds ARIA mismatches
Lighthouse uses the WAI ARIA specification - Definition of roles to check for mismatches between ARIA roles and attributes. Each role has a subset of "supported states and properties" and "inherited states and properties". Any element with that role can only use the attributes in the role's definition.
Lighthouse fails this audit
when it finds an attribute that isn't allowed for a role on an elememnt.
In the example Lighthouse audit above,
aria-checked attribute is not allowed on the
so the audit fails.
This makes sense—as list elements wouldn't have a state of checked,
so applying a checked state would be confusing to screen reader users.
How this audit impacts overall Lighthouse score
Lighthouse flags this as a low severity issue.
It is important to fix,
and probably indicates a mistaken assumption in your code,
but a disallowed attribute won't break the element's role.
In the example above, the element is still announced as a list and
aria-checked attribute would be ignored.
How to avoid ARIA mismatches
To avoid ARIA mismatches, refer to the WAI ARIA Definition of roles. ARIA explicitly defines which attributes are allowed for any given role and for every attribute. Link to the role from the specification, and check the attributes allowed. So long as an attribute is listed for that role, you can use it.
For more information on this audit, see Elements must only use allowed ARIA attributes.
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. Java is a registered trademark of Oracle and/or its affiliates.