WebAIM - Web Accessibility In Mind

E-mail List Archives

(The return of...) Accessible popup menus

for

From: Austin, Darrel
Date: Aug 6, 2005 12:00PM


Coincidently, after last weeks debate on DHTML fly-out navigation, I'm now
at the point where I need to consider it for use on a couple of our sites.

I'm not a big fan of fly-out navigation. Not only because of accessibility,
but also usability. I find my main gripes are:

- they rarely indicate 'you are here' to the user
- they tend to cause the user to spend more time
mousing over each item to explore what's underneath
rather than allowing them to drill down into the site
in a specific path
- initial 'dive' into the site may be quicker, but
subsequent traversing of the site can get tedious
as they have to re-navigate the menu each and every
time they want to move somewhere else.

To be fair, there are a few advantages:
- a large, deep site with many unique customer-centric
areas can benefit by allowing different customers
quickly get to their specific area of the site
- web applications can benefit from this by clearing
up some real estate

In our case, we need a fly-out menu system for our CMS tool that we are
building. People will be jumping all over the place so a one-level menu
system will actually be useful for them. On our public site, we're
considering implementing a fly-out system as an option for the end user
(they could turn this option on if they prefer...otherwise, they'll get the
default hierarchical, nested-list menu)

So, I'm at the point where I need to actually find something that, as best
as it can, is both usable and accessible. Key features I am looking for are:

- unobtrusive and semantic markup (ie, menu can be
nested list with minimal-to-no actuall javascript
in the HTML)
- decent keyboard navigation
- 'timed' show/hide for menus, to allow a person
to mouse out of a top-level item, cross another item
and still get to the first fly-out menu that was triggered
(this is actually my biggest grip with most
fly-out navigation systems)

Any suggestions?

So far, I've looked at about a dozen options. I can group them into these
categories:

1) commercial scripts that look great, are often quite usable, but
completely inaccessible and hardly semantic
2) free scripts that are mostly written poorly, inaccessible, or lacking
some of the nicer usability features.
3) Project Seven's menu system and BrotherCake's menu system...the only two
that seem worth considering. Of the two, BrotherCake seems a bit less
obtrusive in terms of the HTML.

Does anyone have any other suggestions to add to category 3 that I should
take a look at? I can be a little more leniant on the accessibility issues
(as we're making this an option on the public site...not a requirement) so I
am considering a few runner ups such as the CSS based Suckerfish menus.

-Darrel