CODEWITHSUNDEEP
htmlaccessibilityvoiceoverjaws-screen-readernvda
vpiTriumph
vpiTriumph

Reputation: 3166

Heading with link not listed in VoiceOver Headings rotor

To make a site I'm working on WCAG compliant I'm adding semantic structuring to it.

I've noticed if the heading is additionally a link it is not picked up by the screed reader I'm using (VoiceOver).

That is:

<h1>This is a H1 heading</h1>
<h3><a href="someurl.html">This is a H3 heading</a></h3>
<h4>This is a H4 heading</h4>

Shows up in the rotor (ctrl-opt-u) as:

1: This is a H1 heading
4: This is a H4 heading

If you move the h3 text out of <a> tags so This is a H3 heading is a text node, or switch to using span, the header DOES show up in the rotor.

My question is this: Is there a way to get the h3 to show up on the Headings rotor while keeping it as a hyperlink?

If anyone knows if this is a similar problem for NVDA or JAWS that information would be appreciated too.

Upvotes: 3

Views: 1668

Answers (1)

Craig Brett
Craig Brett

Reputation: 2340

Could you try putting the whole heading inside the anchor?

A bit of an odd work around, I know.

I suspect VO shouldn't work like that. For what it's worth, I just tried that code with NVDA and it works, both in the virtual cursor type mode (arrowing up and down) and using H to jump to the next heading. So it seems fine to me.

Upvotes: 1

Related Questions