WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: What's the point of aria-expanded on a menu button?

for

From: Bryan Garaventa
Date: Nov 15, 2023 7:14PM

Hi,
Typically it's not that useful to have aria-expanded on a standalone menu button, but it is, however, very useful on a menu item within a menu.

The value isn't necessarily with keyboard navigable screen readers like JAWS and NVDA, but rather with touch-based screen readers like VoiceOver on iOS. You can try this out here: https://whatsock.com/Templates/Menus/Internal/index.htm

The expanded state is announced so that the submenu list hierarchy is clear during touch navigation.

All the best,
Bryan


-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Patrick H. Lauke
Sent: Wednesday, November 15, 2023 10:10 AM
To: <EMAIL REMOVED>
Subject: Re: [WebAIM] What's the point of aria-expanded on a menu button?



On 15/11/2023 17:13, Jonathan Michael Bodnar via WebAIM-Forum wrote:
> From a component design perspective the button to toggle the menu would be external to the collapsible region of the menu, or external to the menu, and reachable regardless of the menu state. The aria-expanded attribute indicates the state of the menu the button controls.

But a proper menu sets focus to the first menu item when the menu is opened, and if you try to tab/move out of the menu, the menu is closed again. So you don't normally encounter the menu button itself while the menu is also opened. Which is why it's, in practice, redundant (unless you're doing something unusual and *don't* autoclose the menu when moving out of it, which sounds...odd; or if you're actually opening something that isn't a menu as such, but more like a disclosure widget?)

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke https://flickr.com/photos/redux/ | https://www.deviantart.com/redux https://mastodon.social/@patrick_h_lauke | skype: patrick_h_lauke