Skip to main content

presentation-role-conflict

Ensure that elements marked for removal from the accessibility tree are indeed removed.

Severity: Minor

Description

When role="none" or role="presentation" are used, they should interfere with an element’s implicit functionality or with other specified global ARIA attributes.

Why is it important?

When utilizing the role="presentation" or role="none" attributes, it is intended for assistive technologies to disregard the default role of an element while keeping its content visible to users. Nonetheless, there are situations where HTML elements may not adhere to the role="none" or role="presentation" instructions. This typically arises when an element possesses inherent behaviors or explicit properties that hold significance for accessibility and clash with the specified presentational roles. Consequently, the roles are overlooked, allowing users to interact with the element as if the specified role was absent.

Examples

  • Success:

    • An ordered list with role="presentation" attribute and no tabindex or global ARIA attributes.
  • Failure:

    • An ordered list with role="presentation" and tabindex="0" attributes.

How to fix?

For every element with role="none" or role="presentation" attribute, ensure -

  1. It does not have a global ARIA attribute
  2. It is not focusable

Tags

cat.aria, best-practice

References

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback

Is this page helping you?

Yes
No

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback!

Talk to an Expert
Download Copy