CODEWITHSUNDEEP
accessibilitywai-ariascreen-readers
Luca
Luca

Reputation: 9715

Is it acceptable to use "aria-describedby" on a container with multiple children?

I have the following piece of markup:

<input aria-describedby="a b c">/* generic form control */

<p id="a">foo</p>
<p id="b">foo</p>
<p id="c">foo</p>

Would it be acceptable/functional with regards to assistive technologies, to replace it with the following?

<input aria-describedby="d">

<div id="d">
    <p>foo</p>
    <p>foo</p>
    <p>foo</p>
</div>

Upvotes: 3

Views: 1057

Answers (1)

Steve Faulkner
Steve Faulkner

Reputation: 2630

Would it be acceptable/functional with regards to assistive technologies, to replace it with the following?

It is both acceptable and functional. The accessible description for the button becomes "foo foo foo".

What you need to be aware of is that the description is a flat string, no structure is conveyed. Also that verbosity can be an issue as each time the control recieves focus the screen reader will announce the description.

Also in you example code the button needs an end tag and the aria-describedby is not referencing anything, as you have a class attribute, it needs to be an id attribute. http://codepen.io/stevef/pen/ojBmdV

Upvotes: 5

Related Questions