Web and Digital Accessibility is essential for modern restaurants. In this post, I talk about web accessibility best practices for restaurants in key three areas, such as: how to share your menu, how to make the most of alt-text to describe your cuisine and dishes, and how to make the reservations booking process accessible for your customers who use assistive technology.
By highlighting designs and strategies that lead to an accessible experience for assistive technology users, I hope to reaffirm the great work of those doing it right while providing ideas and guidance for those struggling with accessibility.
Because I am blind and use a screen reader, I will be sharing my experience as a screen reader user exclusively.
How to share your menu
One of the most frustrating things about browsing restaurant menus online is the vast number of menus uploaded to the internet as an image. However, I have noticed a positive change here.
In recent weeks, I have encountered seven different restaurant menus uploaded to the site as text-based lists. When facing one of these lists, I can easily navigate it using the text navigation commands of my screen reader.
Here's an example of how one restaurant makes this accessible:
- The menu displays categories as clickable checkboxes above the menu item list.
- I can easily select one of the category checkboxes.
- I can then then navigate the page to explore the options in that particular category.
The experience is fluid, intuitive, and accessible.
Recently, one restaurant site prompted me to download a menu PDF. At first, I was discouraged given my past negative experiences with inaccessible restaurant pdfs. However, I was surprised to find that the site had two menu versions, a standard and an accessible version.
The accessible version was formatted in a very screen reader-friendly way. For example:
- Columns and rows were adequately labeled
- Transitions between menu categories were properly marked.
Design choices like these help improves the accessibility of my digital experience.
How to describe your menu items
Some people will say the images are essential to a restaurant menu. Sighted individuals have told me that the words are helpful for clarification. Still, the photos are what makes their mouths water. For blind individuals like myself, words are all we have unless the menu includes alternative text image descriptions for every item pictured.
The good news is that more restaurants include alternative text captions for the photo corresponding to each dish. Some descriptions are remarkably detailed and give me a solid grasp of how the food will taste. Here is an example of a helpful description of my favorite sandwiches from a local diner.
“Thinly sliced sirloin steak is carefully placed on a garlic bread roll. The sandwich Is topped with a generous portion of perfectly warm and melted mozzarella cheese and is served open-faced on a bed of sweet potato fries.”
This description is excellent and makes me want to dig into the food. In contrast, the word-based menu description of the same sandwich reads,
“Sliced Marinated Steak And Cheese On A Garlic Bread Roll.”
I prefer image captions that describe the food in a way that makes it seem mouth-watering. When I encounter restaurant sites with alternative text image descriptions, I feel more excited to eat at that particular establishment because I know I will get a metaphorical auditory taste of each dish before ordering.
How to improve reservation booking for blind customers
One of the most valuable features on many restaurant sites is booking a table in advance. Lately, I have encountered several accessible reservation booking techniques. They all use a combination of checkboxes and drop-down menus. These are far more accessible than the diagrams, grids, and calendars still standard on many sites.
Here's an example of how one of my favorite local Italian restaurants handles its online reservations:
1) The user picks their desired visit date and party size from a drop-down menu.
2) Next, a list of all available time slots is displayed using clickable checkboxes.
3) Selecting a time slot will bring the user to a short web form asking for a name, email address, and special requests.
4) At this point, I can submit the form, and the reservation is confirmed.
This reservation booking system is intuitive, accessible, and refreshing, given the typical usability issues of reserving almost anything online.
Dear Restaurants, Please keep up the web accessibility progress!
Customers are increasingly viewing your menu online before coming in or choosing to order from you. Prioritizing web accessibility is essential for customers like me to be able to view your menu and book our reservations independently. When you prioritize digital accessibility, your customers take notice and appreciate it!
As a customer with a disability, I am encouraged to see the progress in recent months of strong website accessibility examples from the restaurant industry. I believe the restaurant industry is making great strides toward digital accessibility. If you have a restaurant and want to improve your web accessibility, I hope this post helps and inspires you.
To learn how to improve accessibility on your website and plan your digital accessibility initiative- download the digital accessibility checklist for free here.
Editor's Note: This is a guest post from our marketing intern, Michael Taylor. This post reflects his opinions and experiences. Read more about Michael in his introductory post here.
