WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: [EXTERNAL] aria-expanded menu or dialog?

for

From: Mark Magennis
Date: Mar 8, 2021 2:54AM

The way you describe it Glen, it does sound like a bit of this and a bit of that. Obviously it's not a menu in the sense of an ARIA menu because you don't want users to arrow through the links, so you can't use role="menu" because that would set the wrong expectation. It's not a dialog in the usual sense because it's not modal and dialogs are usually expected to be modal. Neither are they expected to contain just navigation links. It's more like a show/hide panel (aka disclosure), but not quite because you want it to disappear automatically when the user leaves it. This is not necessarily a problem as long as you can set that expectation and/or inform the user when it happens so there is no misunderstanding.

But there's one thing that worries me about your desired behaviour which is that you want it to disappear if you Tab out of it but not if you arrow out of it. This makes sense if you're in a widget such as a menu which explicitly uses arrowing for moving within it, but not if you're in a panel of what appears to be standard web content. I can't see that this logic would be predictable and understandable for users because essentially what happens when you leave it depends on how you leave it. Is there any other type of control that works this way? Also, it visually covers everything else on the page. So why would it be left open at all when you are not in it?

Personally, I would make it more like a modal dialog but not an actual dialog with role="dialog" because it's navigation and dialogs aren't usually navigation. I would present it as a pop-up navigation panel by using a <nav> with a descriptive aria-label and aria-hidden. But I would make it completely modal so you cannot Tab or arrow out of it and I would add a close button with a name that explicitly references the panel's name. So it's functionally a dialog but it's announced as navigation and it's clear that to get out of it you have to close it.

An alternative approach would be to use the behaviour you want but provide a name and/or description that informs the user what to expect and how it works. But I often think that if you have to explain how something works then it's too complicated.

Mark