Tips on making your restaurant website more web accessible
In early October of 2019, The United States Supreme Court declined to hear an appeal to a digital compliance lawsuit between Domino’s Pizza, Inc. and a visually impaired consumer who claimed that Domino’s online delivery platform was not digitally accessible for someone reliant upon an assistive technology and thereby violated Title III of the Americans with Disabilities Act (ADA). This decision not to hear the case upheld the Ninth Circuit Court’s decision, which ruled in favor of an accessible site. It dealt a huge blow to the company that has been fighting litigation for the last few years and could reshape the future of web accessibility guidelines under the ADA.
What is an ADA Compliant Website?
There is a misconception about ADA requirements when it comes to the web. Perry Rahman-Porras, Channel Strategy Manager here at BentoBox adds, "Restaurants spend a lot of money trying to maximize their accessibility, but there is no one to say ‘You've reached 100% compliance’ since the rule of law can be confusing.” What we know is the number of costly, time-consuming web accessibility-related lawsuits is skyrocketing, and overwhelmingly, courts are ruling in favor of accessibility. Striving toward being as accessible as currently possible is essential. There are many solutions out there but it’s important to choose the right one for your restaurant business.
There are digital accessibility companies, such as AudioEye, that provide fully managed solutions that include ongoing monitoring and maintenance as well as legal support in the event a website owner is facing legal action. “BentoBox has teamed up with AudioEye in an ongoing effort to support restaurants with accessible websites that conform to WCAG guidelines and international standards,” says Rahman-Porras. The new offering is ADA Pro, Powered by AudioEye.
8 Must-Have Features for Web Accessibility
To ensure that your restaurant website is on its way to becoming digitally accessible in 2019, there are a few must-have items to have in play.
Keyboard accessibility means that every interactive element, such as links and form controls, are accessible with the Tab key. This is how keyboard-only users navigate web pages and is essential to web accessibility.
Tip: Test for keyboard navigation by going to your homepage from desktop and clicking the "tab" navigation. Does this highlight your main navigation? If not, ask your website provider, agency, or platform about tab navigation. Platforms like BentoBox build this into website templates automatically.
Navigating through Quality Ramen's website using the tab key.
Text-based menus are easily scannable by screen readers to translate to the user and are essential in having a website that is digitally accessible. This is also a best practice for SEO as Google prefers text-based menus over PDFs or images, which it too, cannot scan or read.
Tip: Instead of using PDFs or images of your menus, use a website partner that prioritizes text-based menus over others.
Canal Street Oysters text-based menu.
A toolbar enhances site usability for visitors. This is especially essential for guests who need assistance adjusting text size, spacing, color contrast and have an audio playback option. Toolbars should never interfere with the existing design or negatively affect good user experiences. ADA Pro powered by AudioEye includes a comprehensive toolbar as part of the BentoBox solution. Call your Account Manager or sign up for a demo here.
Tip: Accessibility toolbars can vary on cost, functionality, and more. Ensure you’re partnering with the right company by doing research on its functions and reliability within the space before making a decision.
An example of a website with the AudioEye accessibility widget.
For embedded video content or image carousels, users should have an easily visible play/pause button. Here’s a great example of this:
Tip: If you’re using embedded video or image carousels that are set to autoplay when visiting your site, make sure your web development partner has a solution to allow for a visible play/pause button.
An example of the Lithology Brewing Co. website with a play/pause button.
When creating links to pages or other sources, the anchor text in the hyperlink should be descriptive. Not only does this assist in web accessibility, but this also helps improve SEO. Descriptive anchor text is preferred over more generic text. Here’s an example: When linking to a menu page: “View our menus” instead of “click here.”
Tip: To find if your site has non-descriptive links, search in Google: site:[your domain] "click here".
An example of descriptive text for hyperlinks vs. generic text.
Restaurants should include an accessibility statement in a corresponding link at the footer of their web page with contact information if needed. This shows your ongoing commitment to improving your website’s experience and accessibility to users.
Tip: There are numerous examples of Accessibility Statements online, including on many restaurant websites. Consult with a lawyer on the language if writing one for yourself or partner with a company that provides this for you.
Your website should include a visible stamp from a well-known accessibility partner. There are a host of companies that offer automated accessibility solutions to your website; however, some don’t offer certification stamps. Ensure whomever you partner with, provides a stamp of certification to indicate that they’re providing accessible solutions for users, ADA Pro powered by AudioEye provides this for all users.
Tip: Contact your accessibility partner and ask how many lawsuits they've had for customers with the stamp on their site. It should be close to none. Use this information to decide on your options.
An example of a certification stamp on a restaurant website.
Monitoring and Maintenance
Real-time, 24/7 monitoring and maintenance should be done on your restaurant website. BentoBox’s ADA Pro, powered by AudioEye, utilizes a combination of automation, machine intelligence and human expertise to identify and fix common issues such as alternative text or generic text error. Additionally, AudioEye’s team of digital accessibility experts provides manual audits and remediations, making sure digital access barriers are identified and resolved.
Tip: Partner with a company that offers both automatic and manual remediation so that your website is accessible without you having to worry about it, giving you peace of mind and saving you time and money.
4 Web Accessibility Features to Avoid
While there are many items that can ensure that your website is more accessible, there are also items that restaurant websites should avoid. Here are four web accessibility items to avoid.
While it may seem like uploading PDF menus saves time and effort, it’s actually working to your disadvantage. Guests have to download the PDF on their computer and if on mobile, pinch and zoom to view items. This can negatively affect the guest experience online. It’s also worth noting that screen readers cannot read images or certain PDFs if they are not created with accessibility in mind, which means you’re not providing an accessible experience to those who need it.
Tip: Use a website provider that recommends and converts your PDF menu to text. This shows they’re on top of ADA guidelines.
Alternative Text (Alt text) Missing from Images
Missing alt text on images is highly common across the internet. Most people don’t know how or why it’s essential for accessibility as well as SEO. Images with alt text describing the image can be read by assistive technology and relayed to the user. If you’re a BentoBox customer, alt text is automatically generated when you upload new images into the media gallery.
Tip: Go into your media gallery and spot check five of your images. Do they have alt text tags? If not, add them.
An example of an alt text field when uploaded images on the BentoBox backend.
Using Third-Party Partners That Aren’t Accessible
Having a website that meets all of the requirements under the WCAG guidelines is already difficult enough. Many of the website-related lawsuits stem from linking out to third parties that you partner with, such as online ordering or delivery services. Partner with like-minded companies that are providing web accessibility to their customers and guests.
Tip: Contact your third-party partners and ask for documentation on what they’re doing to become more accessible. Document your exchanges so that you can provide them in the case of any legal litigation.
Graphics That Include Text
Graphics or images that incorporate text should be scannable by assistive technologies. (ex: “Happy Hour” listed within a graphic).
Tip: Try to highlight the text. If you can’t, it isn’t considered accessible. BentoBox customers should be using overlay alerts in the BentoBox backend, which are ADA accessible and provide a better user experience for all.
An example of an alert that is accessible.
By enacting these tips and avoiding mistakes, you’ll be one step closer to an accessible website. Do research and partner with companies that are actively working to help their customers with ADA-related website issues. If you’re interested in learning more about ADA guidelines, web accessibility and BentoBox’s ADA Pro offering powered by AudioEye get in touch or sign up for a demo of our hospitality platform.