RE: accessible drop-down menus

Thanks Bryan,

 

This example is very nice and seems keyboard and screen reader accessible to
me. It is similar (but not the same) as the Canadian Gov Web Experience
Toolkit Working Examples Menu
(https://wet-boew.github.io/v4.0-ci/demos/menu/menu-en.html)

 

It appears your menu follows the DHTML guidelines which suggest that only
the first (or just one) of the main navigation items should be accessible
with the tab key, with the others accessed via the arrow keys (i.e. more
follows the standard paradigm used with computer applications such as Window
Explorer). However, from my testing with keyboard users (with and without a
screen reader) I find that a significant proportion expect to be able to tab
to all the main navigation items in a web page, and become a little
disorientated when this doesn't happen. And in some cases, either they don't
think to use the arrow keys or don't know they can be used for this purpose.

 

With your menu, would it cause any problems if rather than switching between
tabindex=-1 and tabindex=0 for the main navigation items (depending on which
has focus), they all just use the tabindex=0 attribute so that the user can
tab directly from one main nav item to the next?

 

Thanks,

 

Roger

 

From: Bryan Garaventa [mailto:bryan.garaventa@whatsock.com] 
Sent: Sunday, 29 May 2016 3:27 AM
To: 'Roger Hudson'; 'WAI Interest Group'
Subject: RE: accessible drop-down menus

 

The following does this.

https://github.com/accdc/aria-menubar

All the best,

Bryan

 

From: Roger Hudson [mailto:rhudson@usability.com.au] 
Sent: Friday, May 27, 2016 11:45 PM
To: 'WAI Interest Group' <w3c-wai-ig@w3.org>
Subject: accessible drop-down menus

 

Hi 

I am looking for examples of main site navigation systems where a main (top)
navigation item in the menu is able to link to a landing (section) page, and
open a drop-down menu with sub-menu choices. Can anyone suggest examples
that are both intuitive to use with the keyboard and accessible with a
screen reader.

 

Thanks,

Roger

 

Roger Hudson

Web Usability

Mobile: 0405 320 014

Phone: 02 9568 1535

Web: www.usability.com.au

Blog: www.dingoaccess.com

Twitter: http://twitter.com/rogerhudson

Email: rhudson@usability.com.au