WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Screen reader behaviour > tabindex=-1

for

From: Jonathan Cohn
Date: Dec 16, 2017 3:15PM

In Safari on MacOS High Sierra when in "DOM" navigation

the hello button when clicked says:
Hello region

The Goodbye button says
Goodbye You say wy. I say I don't know. group

In "group" navigation:
the hello button when clicked says:
Hello region with 2 items. main
The Goodbye button says:
heading level 1 Goodbye You say wy. I say I don't know. group with 2 items. main

This is with cursor tracking turned on. If one turns off and mouse follows VO cursor. If cursor tracking is turned off the buttons just say they are clicked and no mention is made that focus has changed.


Best wishes,

Jonathan Cohn



> On Dec 15, 2017, at 7:23 AM, Tim Harshbarger < <EMAIL REMOVED> > wrote:
>
> I was interested in the answer to this question so I created a pen to test it:
> https://codepen.io/TimA11y/full/ppJXWN
>
> Basically, you click a button either labelled "Hello" or "Goodbye" which then moves the focus to a section of the page (with a heading that is the same as the button.) The Hello section uses a region with aria-labelledby and a tabindex of -1 like your first example. The Goodbye section doesn't use a role or aria-labelledby, it just uses a tabindex of -1.
>
> NVDA 2017.3 just reads the name of the Hello region and stops there. NVDA reads the full content of the div for the Goodbye section. JAWS 18 seems to read the full content for both.
>
> Didn't have time to look at anything else though.
>
> Personally, I have a feeling that it is better to explicitly assign a role to any non-semantic element that receives focus since you are more likely to know what the results should be. I'm not sure there is anything that explicitly indicates how a screen reader should handle a div with no role and a tabindex of -1, which likely means it is up to the developers of the screen reader to decide what they want to do and there is no guarantee that will always be consistent.
>
> However, others might be able to offer opinions that are more insightful.
>
> Thanks,
> Tim
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Fernand van Olphen
> Sent: Friday, December 15, 2017 4:01 AM
> To: ' <EMAIL REMOVED> ' < <EMAIL REMOVED> >
> Subject: [WebAIM] Screen reader behaviour > tabindex=-1
>
> Hi everyone,
>
> I have a question about screen reader behaviour.
>
> Below are two examples of <div's> that are programmatically focusable.
>
> Example 1:
>
> <div role="region" aria-labelledby="heading" tabindex="-1">
> <h1 id="heading">Heading </h1>
> </div>
>
> Example 2:
>
> <div tabindex="-1">
> <h1> Heading</h1>
> </div>
>
>
> The first example uses aria-labelledby.
> The second example doesn't.
>
> My question:
> In example 1 a screen reader will automatically start reading the heading, once the <div> is focused,
> In example 2, once the <div> is focused, will a screen reader automatically start reading what's inside the div?
>
>
>
> Regards,
>
> Fernand van Olphen
> Accessibility Advisor
> Municipality of The Hague,
> www.denhaag.nl
>
>
>
> De disclaimer van toepassing op e-mail van de gemeente Den Haag vindt u op: http://www.denhaag.nl/disclaimer
> > > > > > > >