Chen
Chen

Reputation: 1

Prevent screen reader from reading aria-label

I have an element with a landmark role (complementary) which requires an aria-label/aria-labelledBy. This element has several focusable child elements with text in them that needs to be read by a screen reader.

Is there a way to prevent screen readers from reading the aria-label of the parent element, while not preventing the children from being read?

EDIT

for this code:

<div id="parent-element" role="complementary" aria-label="some text" tabindex="0">
    <div id="child-element1" tabindex="0">I'm the first child</div>
    <div id="child-element2" tabindex="0">I'm the second child</div>
</div>

Screen readers will read "some text I'm the first child I'm the second child" when focused to the parent-element.

I'm using IBM's "Dynamic Assessment Plugin" for chrome to evaluate my site.

This is the violation that I'm getting: comlementary role must have aria label

More explanation about the violation - https://aat.mybluemix.net/token/ace67f8e-8cad-40b4-be4b-eb02197944bc/6c6a166a-542d-4e1a-8a10-40a4c69e1d1d/doc/w3/help/en-US/idhi_accessibility_check_g1174.html

I don't want it to read the "some text", but I have to use aria-label if I want the site to pass the accessibility evaluation tool.

Upvotes: 0

Views: 2941

Answers (1)

Adam
Adam

Reputation: 18807

An element with the complementary role does not require an aria-label/aria-labelledby.

As long as you keep this attribute, it's quite expected that your screenreader would ignore the content and read that attribute.

EDIT: No official specs indicates the obligation of having an aria-label, but when you have multiple complementary landmarks you should have a unique label according to the W3C. Note that the "should" is very important, as this is not a "must" (and quite useless in practice imho)

ARIA Example: Multiple Complementary Landmarks When there is more than one complementary landmark on a page, each should have a unique label.

A tool is just a tool and that assessment tools are very imperfect.

Upvotes: 0

Related Questions