WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessibility for a sticky menu

for

From: Jonathan Avila
Date: Aug 15, 2014 7:51PM

> make the appearance and disappearance of a menu accessible to users of screen readers?

It seems like sticky menus present a few issues.
1. Discoverability: The user must be able to discover the menu even without scrolling the screen. This could be solved by placing it in the DOM in a strategic location where it might first appear.
2. Access: While the menu is always easily available to users who can see or can use the mouse -- if it only appears at the top of the DOM it is likely more difficult to access for users of screen readers and users of speech recognition. Dragon seems to not put its number markers on fixed positioned items unless the fixed location coordinates are within the initial screen's height. Some options might be access or shortcut keys to focus the menu.
3. Role, name, state: There isn't exactly a good role for such a structure. Any state information such as a visual indication of what page region you are on may not be helpful to users of screen readers because once you move to the sticky menu the region has scrolled and the location is not what it just was. I.e. there is no good way to find out where you are by looking at the menu -- but you tell where you are if the regions are correctly marked with ARIA. The names can easily be indicated and aria-describedby can be used to map to the region headings. Aria-controls or something else can also be used to show the relationship between the menu items and region.
4 ARIA: It would be important to mark the regions with ARIA landmarks and ARIA labels or perhaps HTML5 sections as well as headings to help screen reader users understand the different regions of the page and their relationship.

Best Regards,

Jonathan