WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Modal

for

From: Birkir R. Gunnarsson
Date: May 19, 2015 8:07AM

Yes.
The fact that a.t. does not honor aria-hidden="false" on a child of
element with aria-hidden="true" baffles me, and makes implementing
modal dialogs for screen readers a much more complex enterprise than
it should be.



On 5/19/15, Don Mauck < <EMAIL REMOVED> > wrote:
> Are these traps "keyboard" traps? If so, you need to do what you can to
> keep that from happening.
> -----Original Message-----
> From: Chris Pearce [mailto: <EMAIL REMOVED> ]
> Sent: Tuesday, May 19, 2015 5:26 AM
> To: <EMAIL REMOVED>
> Subject: [WebAIM] Accessible Modal
>
> Hi,
>
> I've used this implementation:
> http://accessibility.oit.ncsu.edu/training/aria/modal-window/version-3/ for
> implementing an accessible modal in the past and has worked well (tested in
> VoiceOver, NVDA, and JAWS).
>
> I was advised by a colleague that it isn't necessary to apply
> `aria-hidden="true"` to the `div` element that contains all the non-modal
> elements, which in the example would be the 'mainPage' div. The reason for
> this is because if focus is trapped within the modal you can't access
> anything outside of it. I was also advised by someone else that you should
> have it as you can access headings outside of the modal via shortcut keys
> and possibly other things so applying `aria-hidden="true"` to all the
> non-modal elements just makes it pretty bullet-proof. My take is that it
> seems to work really well so why change it?
>
> So is applying `aria-hidden="true"` to all the non-modal elements a good
> thing? Any feedback would be greatly appreciated.
>
> Cheers,
> Chris
> > > > > > > > >


--
Work hard. Have fun. Make history.