Often overlooked by sighted users, the convenience of a jump nav or sticky nav while browsing extensive food menus could mean the difference between being hungry and hangry. However, for blind users, cycling through each menu item to reach their desired food category can be frustrating, potentially driving them to switch to a more efficient app for a seamless experience.
The Challenge:
When attempting to navigate a restaurant menu with numerous choices, one of the restaurants listed on Uber Eats has a sticky/jump nav that is unrecognized by the screen reader Talkback. Instead, the screen reader focuses on the food item under the jump nav. In this case, the user cannot utilize the jump nav functionality, requiring them to swipe through all food items rather than directly accessing the desired food category. The only way to get to the jump nav is to physically tap on its location on the page without using the screen reader.
Recommended Best Practice:
To ensure that screen readers can read the sticky / jump nav and that accessibility users can efficiently navigate to specific food items, make sure you are doing the following:
- Place the jump nav in the correct location within the accessibility tree
- Improve accessibility by labeling the jump/sticky nav for screen readers
- Determine the right location to fix the element’s position relative to the viewport
- Ensure the jump nav does not obscure other interface components
Learn more about our inclusive digital experiences.
About the Author
