In this Article
What It Means and Why It Matters
Not all combinations of ARIA roles and attributes are valid. This check verifies that no attributes are used with a given role that are prohibited for that role in the latest WAI-ARIA specification.
Using ARIA attributes in roles where they are not allowed can prevent important information from being conveyed to users of assistive technologies. These technologies may also attempt to compensate for misuse, which results in inconsistent and potentially confusing behavior.
Diagnosing the Problem from a Page View
Follow these steps to begin your diagnosis:
From the Detail Page View in DubBot, expand the details for the issue you are investigating.
In the Failure Summary area, find the ARIA attribute that has been flagged as not allowed. The attribute
aria-required="true"is the flagged item in the example below.Review the Element Source content to gain a better understanding of where the issue is located on your webpage.
Visit the W3C WAI-ARIA 1.2 Definitions of States and Properties to look up the role noted in your Failure Summary area. Any items not explicitly allowed in the WAI-ARIA specification are prohibited.
Common Client Issue
The aria-label and aria-labelledby attributes cannot be used on a <div> or <span> with no valid role attribute.
The example below is flagged because the <div> has no valid role set. In the corrected code, the div has been given the role="button". The role you use to correct these errors must be appropriate to their content.
Flagged:
<div class="share-code" data-tooltip="Share" aria-label="Share">
Corrected:
<div role="button" class="share-code" data-tooltip="Share" aria-label="Share">
aria-label and aria-labelledby Attributes Prohibited in these Roles
Roles that cannot be named (Name prohibited) — can't use aria-label or aria-labelledby
Third-party Content
Many clients encounter this issue with third-party content embedded in their sites.
Learn more about managing Third-Party Content on Your Sites and Accessibility Issues.
If you have questions, please contact our DubBot Support team via email at help@dubbot.com or via the blue chat bubble in the lower right corner of your screen. We are here to help!