With Valentine's Day in the rearview mirror, I think it is the perfect time to discuss accessibility on restaurant websites. I and many others searched multiple restaurant sites to find the best place for that special Valentine's dinner. Unfortunately, I frequently encounter several common accessibility-related challenges when searching for a restaurant. First, I will discuss some of my experiences in this post and provide helpful tips that will hopefully aid restaurant owners in creating a more accessible and usable website. As always, I will be speaking from the perspective of a screen reader user.
The ability to browse restaurant menus online is one of the most valuable features of the modern digital experience. Unfortunately, I have found that many online menus need to be more usable for the blind and other assistive technology dependents like myself.
The most common problem I encounter is menus uploaded to the site as an image. A restaurant will use photographs of a physical menu and upload the images to the website to serve as the online menu. Since images are not screen reader detectable, this method, without alternative text, is not accessible to blind users.
Another common issue is when a restaurant adds a pdf to the site as an embedded attachment. Unfortunately, screen readers generally do not interpret PDFs correctly. Menu formatting in the pdf can also present a problem. For example, the menu format might use columns and rows for space conservation and visual appeal. Even if my screen reader detects the PDF correctly, the column-based design can cause my screen reader to announce a random jumble of words and numbers.
The best way to create an accessible online menu is to manually enter all details as plain text using a single-column layout.
Since the start of the pandemic, many restaurants have done away with paper menus in favor of a scannable QR code placed on every table. I have heard that eliminating physical menus makes all menus accessible, but this is not the case. Suppose the QR code directs the user to an inaccessible digital menu. In that case, it is just as bad as handing a blind person a print paper menu and expecting them to be able to use it.
As contactless payment becomes increasingly popular, many restaurants encourage patrons to pay their bills by scanning a QR code on a terminal at the table and completing the transaction through the website. Though I have tried this payment method, I have never had much success. The biggest problem is that I need help finding the actual bill total once directed to the restaurant's site. All my screen reader detects are the text entry fields for the payment card. In most cases, the total is on top of a decorative graphic of a print receipt, and therefore my screen reader misses it.
Unfortunately, restaurants rarely use plain text here. This problem is significant because contactless payment is becoming the way of the future. Not hearing the total through my screen reader before I pay the bill is a considerable limitation.
Many restaurant sites allow customers to reserve a table for a future date and time. This functionality does not work best for screen reader users. The problem is with the time selection calendar. On most restaurant sites I have visited, the site prompts the user to select a reservation date. Picking a date usually works fine for me.
This year, the problems began when I tried to pick the time of my reservation. The site will usually display a grid of times. In most cases, the already reserved times will appear grayed out, and customers can't choose them. The problem is that, for whatever reason, my screen reader cannot differentiate the unavailable times and reads each time entry the same as the rest. I can overcome this problem by manually selecting each time and activating the continue button, but it's a frustrating experience. If nothing happens, I know that I have chosen an unavailable time.
This being said, I ran into an even bigger issue on several sites recently. For some reason, the time slot that my screen reader focused on was not selected visually. I believe this is due to the formatting. Before I became aware of this flaw, I could have reserved a table for the wrong time without knowing it because of the screen reader focus issue.
So what is accessible? Drop-down scroll wheels for date and time selection are generally more accessible than tables and grids and are easier for my screen reader.
Based on my experience last week, here are some accessibility-related tips for restaurant owners.
1. Never upload an online menu as an image or PDF. If you can, manually add the menu details to the site as plain text.
2. Pay particular attention to formatting. Charts, tables, and columns are unfriendly formatting attributes for screen readers. They should be replaced with or supplemented by accessible alternatives when appropriate.
3. If critical information is presented through an image or graphic, always include an alternative text caption to convey the information to assistive technology users.
4. If you are unsure how to make your restaurant's site accessible, consider engaging an external partner to help guide you.
As we just had one of the busiest days of the year for restaurants on Valentine's Day, there is no time like the present to begin the conversation surrounding restaurant site accessibility. Modern restaurant websites offer some great functionality that is unfortunately not currently accessible to all users.
If you are a restaurant owner, I hope this blog on my experience with website accessibility provides guidance and inspiration that will help you to serve a more accessible experience to your diners with disabilities.
To learn how to plan your digital accessibility initiative- download the digital accessibility checklist for free here.
Editor's Note: This is a post by our marketing intern, Michael Taylor. This post reflects his opinions and experiences. Read more about Michael and some other posts on his experience online here.