WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Jquery.focus() and screen reader

for

From: Birkir R. Gunnarsson
Date: Aug 17, 2017 6:41AM


Two thoughts:

1. Are you sure the CSS selector is working (might be better to give
your license agreement alert div an id an use that for the selector).
2. Use tabindex="-1" on the div, makes it focusable by JavaScript
without interrupting the focus order of the rest of the page. These
two should ensure that keyboard and screen reader focus are moved
appropriately.

Bigger question:
Does your alert div have any focusable element (do you expect the user
to interact with it, e.g. by clicking a button or checking a
checkbox))?
If so, the role should be alertdialog, not alert, and it should have
aria-label="license" or whatever is descriptive.
Check the ARIA authoring Practices entry for dialogs.
If it does not have any focusable elements, does it need to receive focus?
The alert role should be enough to have screen readers announce it,
and if it is properly highlighted and appears in the expect place in
the screen (close to where the user would be located when it gets
triggered) it should be good enough for screen maagnification users.




On 8/16/17, JP Jamous < <EMAIL REMOVED> > wrote:
> Thanks Patrick. That's helpful.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf
> Of Patrick H. Lauke
> Sent: Wednesday, August 16, 2017 11:02 AM
> To: <EMAIL REMOVED>
> Subject: Re: [WebAIM] Jquery.focus() and screen reader
>
> On 16/08/2017 17:00, Patrick H. Lauke wrote:
>> Don't set tabindex=0 on non-interactive elements, as otherwise they'll
>> fall into the regular keyboard focus cycle.
>
> sorry, missed out the second part of my thought: set it to tabindex="-1"
> which means "programmatically focusable (e.g. via JS), but not in the
> regular focus order"
> P
> --
> Patrick H. Lauke
>
> www.splintered.co.uk | https://github.com/patrickhlauke
> http://flickr.com/photos/redux/ | http://redux.deviantart.com
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > http://webaim.org/discussion/archives
> >
>
> ---
> This email has been checked for viruses by AVG.
> http://www.avg.com
>
> > > > >


--
Work hard. Have fun. Make history.