WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Mega Menu

for

From: _mallory
Date: Jan 18, 2017 5:51AM

It's in Dutch, but I've wondered how the menu at vanbeekdesign.nl does.
I feel it's main drawback for screen reader users is that while the
submenus appear on focus (hitting Enter would activate the link like
normal), you would have to try arrowing around to know whether there
IS a submenu. Someone recommended aria-haspopup once for that, but
not sure if that makes sense for things without menu roles.

The main drawback for sighted keyboard users is they would have to know
to switch to arrow keys. On the other hand, that makes tabbing through
the menu fast (the subs are much much too large but the client insisted
on stuffing everything under the sun in the submenus) compared to having
all the subs' anchors themselves in the tab order.

The main menu items themselves are fallbacks if for any reason a user
can't reach the subs, or doesn't see them, since the main links go to
category pages anyway, from which one can eventually reach everything
also listed in the subs. I'm still not sure how intuitive it is percieved
by most users, and I'm pretty sure pure screen reader users miss the subs
entirely anyway.

cheers,
_mallory


On Sat, Jan 14, 2017 at 07:20:49AM +0100, Detlev Fischer wrote:
> Just tested the Deque Mega Menu https://dequeuniversity.com/library/aria/menus/megamenu# <https://dequeuniversity.com/library/aria/menus/megamenu#>
> quickly on a Mac with Safari. The submenus expand when activated, not when focused, which is fine (and they expand on mouseover).
> What's different from what I expected is that the focus automatically moves to the first subindex item after activation.
> This is one way of emphasising that the menu is no open - you don't need to tab or arrow onwards to get to the first item. The drawback is that the action on the main menu item is not a simple toggle action. But you can get back to the collapsed state (and your former focus point on the main menu items) hitting ESC.
>