WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Keyboard menu accessARIA

for

From: Steve Faulkner
Date: Jul 3, 2012 3:57AM

Hi Joe,
the unfamiliarity of this type of keyboard interaction on the web may be an
issue.
Note that this interaction will be come more common as the HTML5 menu
element [1] is implemented in browsers.

A possible method to overcome the unfamiliarity is to provide pseudo
tooltip [2] that is displayed when the first item receives focus. this can
be used to include brief instructions to the user such as "use arrow keys
to navigate" or some such.


[1] http://dev.w3.org/html5/spec/the-menu-element.html#the-menu-element
[2] http://hanshillen.github.com/jqtest/#goto_tooltip

regards
SteveF

On 3 July 2012 09:13, Joe Chidzik < <EMAIL REMOVED> > wrote:

> I appreciate the value of using ARIA to make drop down menus more
> naturally accessible by accepting arrow key navigation. This can reduce the
> amount of keystrokes required, and typically more closely matches standard
> desktop application behaviour.
>
> A good example is the main menu on the IBM site:
> http://www.ibm.com/us/en/
>
> You can tab to the first item, then arrow leftright to select, and enter
> to expand the menu. Similar, one within the expanded menu, you can tab
> between menus, and arrow updown within the menus.
>
> (As an aside, within JAWS, the main menu is announced as "toolbar", and
> the sub menus announced as "menu". Using NVDA, the main menu items are just
> announced "button" with the submenu items announced as "link"; a
> shortcoming in NVDA, imho, but I assume it will be fixed. Though my
> question is about keyboard accessibility for sighted users.)
>
> Whilst this ARIA based approach is more accessible as keyboard users don't
> need to tab through every item, they can instead quickly arrow to the
> required menu link, is there a danger of some users, who are familiar with
> the tabenter paradigm of keyboard accessibility on the web, perhaps not
> realising that the arrow keys can be used? Or is it safe to assume that
> users will be familiar with this approach, which is similar to Windows
> (and I assume Mac and other platform) applications, where keyboard access
> is granted by tabenter and arrow key presses?
>
> I've typically recommended that site's put something on their
> accessibility page telling keyboard users how to access the site e.g. use
> arrow keys to switch between items, and enter to expand.
>
> I'm using the IBM site as an example here. I've found it well done
> generally, but have seen other sites using ARIA in a less well implemented
> way, where it might be less obvious that you need to use a combination of
> arrow keystabenter to get around.
>
> Would be interested in other's opinions on this.
>
> Kind regards
> Joe
> > > >



--
with regards

Steve Faulkner
Technical Director - TPG

www.paciellogroup.com | www.HTML5accessibility.com |
www.twitter.com/stevefaulkner
HTML5: Techniques for providing useful text alternatives -
dev.w3.org/html5/alt-techniques/
Web Accessibility Toolbar - www.paciellogroup.com/resources/wat-ie-about.html