CODEWITHSUNDEEP
accessibilitywai-ariascreen-readersnvda
Pankaj Kumar Singh
Pankaj Kumar Singh

Reputation: 164

NVDA screen reader is not reading aria-labelledby and aria-describedby in Internet Explorer

I started working on accessibility. aria-labelledby and aria-describedby work fine in Chrome and Firefox but it is not properly read by NVDA in IE.

<div id="div1">div 1</div>
<div id="div2">div 2</div>
<div>div 3</div>
<button aria-labelledby="div1 div2 buttonName1"><span id="buttonName1">Test1</span></button>
<br>
<button aria-describedby="div1 div2 buttonName2"><span id="buttonName2">Test2</span></button>

Upvotes: 2

Views: 3344

Answers (1)

aardrian
aardrian

Reputation: 9009

This is a known bug in Internet Explorer. It is unlikely to be fixed since development efforts are focused on Edge. As such, many NVDA users pair with Firefox.

IE 11 does not support aria-labelledby or aria-describedby with single or multiple id references unless the referenced element is what Microsoft classes as an accessible element. IE non-accessible elements can be made into accessible elements by the addition of tabindex="-1" as documented or via the addition of an ARIA role (when appropriate).

(Unfortunate) example:

<p tabindex="-1" id="label-1">label text</p>
...
<input type="text" aria-labelledby="label-1">

Read more here: https://www.paciellogroup.com/blog/2014/06/aria-labelledby-aria-describedby-support-popular-windows-browsers/

Upvotes: 7

Related Questions