As more diners turn to online platforms to browse menus, place orders, and make reservations, accessibility for your restaurant's digital content has become paramount in 2024. Yet, common misconceptions can act as roadblocks on your digital accessibility journey.
In this blog, I cover lessons from restaurant websites that can be applied to any website, three common myths surrounding web accessibility in the restaurant industry, and I share best practices to help you create a better experience for all your online visitors.
Editor's Note: This post has been updated and optimized for companies who want to be more inclusive online in 2024.
Not a restaurant owner or website manager for a restaurant? Here are four takeaways from this blog that you can apply to any website.
One of the most frustrating things about browsing restaurant menus online is the vast number of menus uploaded to the internet as an image.
When restaurants upload their menus to the site as text-based lists, I can easily navigate the menu using the text navigation commands of my screen reader.
Here's an example of how one restaurant makes this accessible:
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 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:
Design choices like these help improve the accessibility of my digital experience.
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 people, 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 photos 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.
I dive into al-text as a topic in a previous blog, for more on this topic, read Image Alt Text Best Practices For Web Accessibility.
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.
I've written about a negative experience with online reservation systems. For more on this topic, read my blog, Screen Reader Struggles: Navigating Restaurant Reservations.
By embracing best practices in web accessibility, restaurant owners can create genuinely inclusive online experiences for their patrons.
With the release of WCAG 2.2, (read about it here) and its focus on improving accessibility for users with cognitive and learning disabilities, there's an increased urgency to prioritize accessibility in digital offerings across industries, especially in food service and e-commerce.
In 2024, let's seize this opportunity to enhance the dining experience for all customers, regardless of ability, and create a digital environment where everyone feels valued and empowered to engage with your restaurant's digital content.
Editor's Note: This is a guest post from our marketing contributor, Michael Taylor. This post reflects his opinions and experiences. Read more about Michael in his introductory post here.