I have taken this code from wcag where they assign aria-describedby to a link.
https://www.w3.org/WAI/GL/wiki/Using_aria-describedby_for_link_purpose
This works on windows with NVDA but when using voiceover on mac Safari or Chrome, the description is not announced.
If you change the tag to then it will work. It does not work even if I assign with role=”link”
<code><!DOCTYPE html>
<html>
<body>
<ul>
<li id="li1">
Check out the video report for last year's
<a href="festival.htm" aria-describedby="li1">National Folk Festival</a>.
</li>
<li id="li2">
<a href="listen.htm">Listen to the instruments</a>
</li>
<li id="li3">
Guitar Man: George Golden talks about
<a href="mkguitars.htm" aria-describedby="li3">making guitars</a>.
</li>
</ul>
</body>
</html>
</code>
<code><!DOCTYPE html>
<html>
<body>
<ul>
<li id="li1">
Check out the video report for last year's
<a href="festival.htm" aria-describedby="li1">National Folk Festival</a>.
</li>
<li id="li2">
<a href="listen.htm">Listen to the instruments</a>
</li>
<li id="li3">
Guitar Man: George Golden talks about
<a href="mkguitars.htm" aria-describedby="li3">making guitars</a>.
</li>
</ul>
</body>
</html>
</code>
<!DOCTYPE html>
<html>
<body>
<ul>
<li id="li1">
Check out the video report for last year's
<a href="festival.htm" aria-describedby="li1">National Folk Festival</a>.
</li>
<li id="li2">
<a href="listen.htm">Listen to the instruments</a>
</li>
<li id="li3">
Guitar Man: George Golden talks about
<a href="mkguitars.htm" aria-describedby="li3">making guitars</a>.
</li>
</ul>
</body>
</html>