Accessibility rule: Menu item is missing a text alternative, explained
Summary
Menu items must include a meaningful text alternative so screen readers can clearly communicate their purpose. Without it, users relying on assistive technology may not understand navigation options, creating a significant accessibility barrier.
Overview
This rule explains why menu items require accessible names and how missing text alternatives affect usability. It outlines how Siteimprove detects the issue and provides guidance on ensuring menu items are properly labeled for assistive technologies.
What this rule means
The menuitem role in HTML indicates that an element is an option in a set of choices contained by a menu or menubar. If a menu item is represented by an image or icon, it should be given a meaningful text description so that it is announced to a screen reader user. This rule flags menu items which are missing a text alternative.
Why this matters?
Who is impacted by this?
The barrier impacts screen reader users. As menu systems are often repeated on every single page of a website and are essential for navigation, this barrier has a broad impact.
How does the rule work?
The rule checks that each element with a menuitem role has a non-empty accessible name.
How do I fix the issue?
Add an accessible name for the menuitem. The text should describe either:
- the website section, page, or subpage the menuitem links to or;
- the interaction the visitor can expect after they click on the menuitem
Note that the title attribute is not always a reliable way to provide an accessible name. Use aria-label instead.
Additional Information
Did you find it helpful? Yes No
Send feedback