WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: resolving conflict between JAWS and key-press events for navigating large drop-down menus

for

From: Mallory van Achterberg
Date: Aug 25, 2014 8:07AM

I gotta say, I really like that Abode isn't using the whole menu/
menuitem role stuff. Reading the spec, that menu stuff sounds
entirely like an application/widget thingie, not a list of links
like all web navigation menus should be.

But as a sighted keyboarder, discoverablility hits me there.
If I didn't think to try mystery-meating with my arrow keys,
I as a "Typical Web Keyboarder User" would never, ever know
that there were any submenus. If I use tab or the left/right
arrows I move along as expected to the main menu items (sparing
me the Thousand Tabs of Death), and I see if yo *do* magically
happen to try using a top/bottom arrow key, then aria-expanded
and aria-hidden set to "false" should let users know there's an
existing, active, explorable submenu.

On the other hand, the Adobe menu mostly seems awesome as a web
menu, but what Michael describes seems an awful lot like a
complicated government-style menu with a lot of controlly thing...
in which case, I dunno, maybe he should be using the complicated
(and easy to mess up apparently) menu/menuitem role system.

_mallory
On Mon, Aug 25, 2014 at 01:19:00PM +0000, Jonathan Avila wrote:
> Michael, I believe your ARIA roles could be on the wrong elements. Take a look at this mega menu implementation contributed by Adobe. http://adobe-accessibility.github.io/Accessible-Mega-Menu/
>
> Best Regards,
>
> Jonathan
> SSB BART Group
>
> -----Original Message-----
> From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED> ] On Behalf Of Michael Tangen
> Sent: Friday, August 22, 2014 3:39 PM
> To: <EMAIL REMOVED>
> Subject: [WebAIM] resolving conflict between JAWS and key-press events for navigating large drop-down menus
>
> I have been toiling over this for weeks now, researching solutions that others have developed for fully keyboard-navigable menus (both for sited users that have physical impairments and for non-sighted users that rely on assistive technology such as JAWS). I have a drop-down menu script <http://designbymichael.com/test/menu/>; that I've built for our state agencies at the State of Minnesota and it works quite well....but I am having one problem: JAWS has reserved both the use of arrow keys and the space bar...and this is a problem from my perspective. While those keys do offer the user certain abilities, it does restrict my ability to allow a user to navigate through complex menu systems with arrow keys or to toggle the display of submenus. If there's one thing that state government are known for is vast layers of navigation to traverse through — and I'm trying to alleviate that a little.
>
> The example menu I hyperlinked below allows you to navigate through the entire menu one of two ways: using arrow keys to drill down through the menus and traverse back up again, or using a combination of the tab and shift-tab keys to navigate and the spacebar to toggle the visibility (and
> accessibility) of submenus. It works fine when you are just using a browser without JAWS or on the Mac if you use Safari along with VoiceOver.
> Furthermore with VoiceOver and Safari, you can navigate through the menu with either the arrow keys or the tab keys with space bar to toggle subnavigation visibility.
>
> So I'm at a loss as what to do for JAWS users. What keyboard event can I use to toggle the display of submenus without conflicting with keyboard shortcuts that are reserved by JAWS? My requirements:
>
>
> - Submenus must be hidden when not activated or needed, largely so the
> screen reader doesn't read dozens and dozens of links that the user may
> have no interest in hearing
> - Intuitive means of navigating through complex trees of navigation
> (arrow keys and/or (shift) tab keys)
> - If arrow keys are not available to the end user (I'm looking at you
> JAWS), an intuitive key choice to toggle the visibility of a submenu.
>
> I've taken all the known steps to ensure accessibility, but I'm at a loss with the conflict of what keys JAWS has assumed for itself with what keys are commonly used for navigational purposes.
>
> Thoughts?
>
> Test menu: http://designbymichael.com/test/menu/
>
> - Michael
> > > > >