Digital Menu Accessibility: Your Complete Compliance Guide

A customer in a wheelchair enters your restaurant. Your dining room meets accessibility standards, the ramp is in place, and the table is adapted. But when they scan the QR code to view your menu, they're faced with a PDF that their screen reader can't interpret. The entire accessibility chain breaks at its final link: your digital menu.

Digital menu accessibility isn't a topic reserved for large chains or e-commerce websites. It concerns every restaurateur who offers an online menu, a table-side QR code, or a menu that can be viewed on a smartphone. In the UK alone, over 16 million people live with a disability — visual, motor, hearing, or cognitive. And then there are temporary situations: an arm in a cast, eyesight declining with age, or a screen too bright to read outdoors. Your digital menu needs to work for all of these scenarios.

And it's not just about good intentions. Regulations in the UK, the EU, and internationally now impose specific obligations regarding digital accessibility. Failing to comply means risking sanctions — but above all, it means losing a portion of your clientele.

This guide gives you the practical steps to make your digital menu compliant and usable by everyone, without unnecessary technical jargon and with actions you can implement this very week.

What the law says about digital menu accessibility

The Equality Act 2010 and WCAG standards

The Equality Act 2010 in the UK (and the Americans with Disabilities Act in the US) established the legal foundations for accessibility. While these laws initially focused on physical premises and public services, their scope has progressively extended to digital services.

The Web Content Accessibility Guidelines (WCAG) 2.1, the international standard published by the W3C, translate these obligations into concrete technical criteria. WCAG defines three levels of conformity: A (minimum), AA (recommended target), and AAA (optimal). In the EU, the EN 301 549 standard (similar to France's RGAA framework) maps directly onto these WCAG levels.

For an independent restaurateur, the question is framed differently than for a government body. Your website or digital menu may not necessarily fall within the mandatory scope of public-sector accessibility regulations. But two factors are changing the landscape.

The European Accessibility Act (Directive 2019/882)

The European Accessibility Act (Directive 2019/882) has been applicable since 28 June 2025. It imposes accessibility requirements on digital products and services offered to consumers, including e-commerce services.

If your digital menu allows online ordering, click & collect, or table-side payment, you potentially fall within the scope of this directive. Micro-enterprises with fewer than 10 employees and annual turnover not exceeding €2 million (approximately £1.7 million / $2.2 million) benefit from an exemption for services. However, this exemption doesn't cover all cases, and the regulatory trend is clearly moving towards broader application.

Public premises obligations and their digital extension

Your restaurant is a public-facing establishment. As such, you are already subject to physical accessibility standards for people with reduced mobility. The regulatory logic is consistent: if physical access must be guaranteed, access to information — including your menu — must be as well.

In practice, an accessibility inspection that finds your only available menu is an inaccessible QR code could constitute a point of non-compliance. A paper menu remains an alternative, but if you've gone fully digital — and more and more restaurants are doing so — the accessibility of that format becomes a de facto obligation.

The four types of disability to consider for your accessible digital menu

When people think "disability" in the restaurant industry, they often picture a wheelchair. But digital accessibility covers a much broader spectrum. Your accessible digital menu must address four categories of needs.

Visual impairment

This is the most impactful case for a digital menu. It encompasses total blindness, low vision, colour blindness, and age-related vision difficulties. A blind person uses a screen reader (VoiceOver on iPhone, TalkBack on Android) that reads the screen content aloud. If your menu is a simple scanned PDF or an image, the screen reader "sees" nothing: it announces "image" or remains silent.

A person with low vision needs to be able to enlarge text without the layout breaking, and sufficient contrast between text and background. A colour-blind person won't spot a dish marked in red as "spicy" if colour is the only indicator.

Motor impairment

A person with a motor impairment may struggle to use a touchscreen with precision. Buttons that are too small, dropdown menus requiring a precise finger swipe, tappable areas too close together: these are invisible obstacles for you, but completely blocking for them.

Some users navigate exclusively via keyboard or assistive devices (switches, voice commands). Your menu must work without a touchscreen.

Hearing impairment

If your digital menu includes audio or video content — a chef's introduction, a dish preparation video — deaf or hard-of-hearing customers cannot access them without subtitles or a transcript.

Cognitive impairment

Cognitive conditions (dyslexia, attention disorders, intellectual disabilities) affect a significant portion of the population. A cluttered menu with complex navigation, obscure terminology, or inconsistent layout becomes a barrier. Simplicity and clarity actually benefit all your customers, not just those with disabilities.

Technical criteria for an accessible digital menu

Let's get into the specifics. Here are the technical criteria your disability-friendly restaurant menu must meet to be considered accessible.

Semantic structure and logical navigation

Your digital menu must have a clear, hierarchical structure. In technical terms, this means using appropriate HTML tags: headings (h1, h2, h3) for categories and subcategories, lists for dishes, and paragraphs for descriptions.

Why does this matter? A screen reader relies on this structure to allow users to navigate. If your categories — "Starters", "Mains", "Desserts" — are simply bold text without heading tags, a blind user cannot jump directly to desserts. They must listen to the entire menu, dish by dish.

Navigation should follow a logical order:

• Categories are clearly identified and separated
• Each dish is presented in a distinct block (name, description, price, allergens)
• Users can navigate between categories without going back to the beginning
• Keyboard focus follows the visual reading order (top to bottom, left to right)

Contrast and readability

WCAG guidelines impose minimum contrast ratios between text and its background:

• 4.5:1 for normal-sized text (Level AA)
• 3:1 for large text (18px bold or 24px regular)
• 3:1 for informational graphic elements (icons, buttons)

In practice, this means that light grey text on a white background — a very trendy aesthetic in menu design — is often non-compliant. White text over a food photo as background poses the same problem: contrast varies depending on the area of the image.

To check your contrast, free tools are available: WebAIM's Color Contrast Checker or the WAVE browser extension. When working on the design of your digital menu, make sure to test every colour combination with these tools.

Interactive area sizing

Buttons and links on your menu must have a minimum size of 44 × 44 pixels (WCAG 2.1 recommendation, criterion 2.5.5). This ensures that a person with motor difficulties can activate them without error.

In practical terms, if your "Add to basket" button is only 30 pixels tall, it's too small. If two buttons sit flush against each other with no spacing, a person with hand tremors will consistently tap the wrong one.

Screen reader compatibility

Your menu must be fully readable by a screen reader. This means:

• Each decorative image has an empty alt attribute (alt="") so it is ignored
• Each informational image has a descriptive alt text (e.g., alt="Caramelised apple tarte tatin")
• Prices are readable (not "£14.50" crammed together without spacing, but "£14.50" in a clear format)
• Icons have an accessible label (a leaf icon for "vegetarian" must be accompanied by the text "Vegetarian", even if it's only visible to screen readers)
• Allergen information does not rely solely on colour codes or icons without text

Screen size and zoom adaptation

Your digital menu must remain readable and functional when the user zooms up to 200% (WCAG criterion 1.4.4). This means:

• No horizontal scrollbar at 200% zoom
• Text reflows rather than being truncated
• Images don't obscure text when the screen is enlarged
• Navigation remains usable

A menu built with responsive design generally meets this criterion. A scanned PDF or fixed image never does.

Practical guide: make your digital menu compliant in 10 steps

Here's how to check and improve the accessibility of your existing digital menu. Each step can be completed without advanced technical skills.

Step 1: Ditch the PDF or image format

If your online menu is a scanned PDF, a photo of your paper menu, or a fixed image, that's the first barrier to remove. These formats are inaccessible by nature: screen readers can't interpret them, zooming pixelates them, and navigation is impossible.

Switch to a native HTML menu — a properly structured digital menu with selectable text. If you've followed a QR code menu setup guide, check that the chosen solution generates actual HTML content rather than a simple hosted PDF.

Step 2: Check your heading structure

Open your digital menu on your phone. Activate the screen reader (VoiceOver on iPhone: Settings > Accessibility > VoiceOver; TalkBack on Android: Settings > Accessibility > TalkBack). Navigate through your menu using swipe gestures.

Ask yourself these questions:

• Are categories announced as headings?
• Can you jump from one category to another?
• Does the reading order match the visual order?
• Is each dish clearly separated from the next?

Step 3: Test your contrast

Use the WebAIM Contrast Checker online tool. Enter your text colour and background colour. The tool instantly tells you whether the ratio is compliant.

The most common mistakes among restaurateurs:

• White or cream text on a pastel background
• Text over a background photograph without an opaque overlay
• Prices in light grey to visually distinguish them from dish names
• Decorative text in a faint colour

Step 4: Enlarge your tappable areas

If your menu allows filtering by category, adding dishes to a basket, or navigating between pages, check that every button or link is at least 44 × 44 pixels. Also consider spacing: a minimum of 8 pixels between two interactive areas prevents touch errors.

Step 5: Add text alternatives

Every image that conveys information must have alt text. This includes:

• Dish photos (if they're the only way to see what the dish looks like)
• Allergen icons
• Labels (vegetarian, homemade, organic)
• Certification or quality mark logos

Step 6: Check keyboard navigation

Connect a Bluetooth keyboard to your tablet or test from a computer. Navigate your menu using only the Tab key (forward), Shift+Tab (back), and Enter (activate). Every interactive element must be reachable, and the focus indicator (the outline showing where you are) must be visible.

Step 7: Simplify the language

Re-read your dish descriptions with fresh eyes. Are technical culinary terms ("seared", "deconstructed", "house condiment") understandable to everyone? Add a brief explanation when a term isn't widely known.

This ties into the issue of multilingual menus: clear language benefits people with cognitive disabilities just as much as customers who aren't native speakers.

Step 8: Never convey information through colour alone

If you use colour coding to indicate spicy dishes (red), vegetarian options (green), or gluten-free items (yellow), always add text or a labelled icon alongside. Colour coding alone excludes colour-blind individuals and screen reader users.

Step 9: Make sure your forms are accessible

If your digital menu includes an order form, a reservation form, or a feedback form, every field must have an explicit associated label. Not just a placeholder that disappears when you start typing, but a permanent label that identifies the field. Error messages must be clear and positioned near the relevant field.

Step 10: Offer an alternative

Even with a perfectly accessible digital menu, keep an alternative for extreme cases: a Braille menu for regular blind customers, a large-print menu, or the option for staff to read the menu aloud. Accessibility is also about human flexibility.

Common mistakes that make your menu inaccessible

Here are the mistakes we see most often on digital menus at independent restaurants.

The "convenient" PDF

The most common reflex: scan the paper menu and put it online. It's quick, but it's the least accessible format there is. The text isn't selectable, zooming degrades quality, the screen reader can't read anything, and the layout doesn't adapt to the screen.

The all-image menu

A variation of the PDF: each menu section is an image with text "embedded" in it. Visually appealing, technically inaccessible. Text inside an image doesn't exist for a screen reader.

The dish carousel or slider

Auto-scrolling carousels pose numerous accessibility problems: difficult keyboard navigation, content disappearing before it's been read, and animations that are disruptive for people with epilepsy or cognitive conditions. Opt for a static, scrollable list instead.

Animation overload

Parallax effects, page transitions, dishes fading in progressively: these decorative effects can cause nausea or dizziness in people sensitive to motion (vestibular disorders). WCAG recommends offering an option to reduce animations (the system preference prefers-reduced-motion).

Auto-playing audio or video

If your menu automatically launches background music or a presentation video, screen reader users can no longer hear their assistive tool's announcements. All audio or video content must be triggered voluntarily by the user.

Session timeouts

Some menus with online ordering disconnect the user after a few minutes of inactivity. A person using a screen reader takes longer to browse the menu. A timeout that's too short forces them to start over from the beginning. Allow a generous delay or provide a warning before disconnection.

How to test the accessibility of your digital menu

Testing your menu's accessibility yourself doesn't replace a professional audit, but it helps identify major issues. Here's a three-level approach.

Level 1: Automated tests

Automated tools detect roughly 30 to 40% of accessibility issues. They're a useful first filter.

• WAVE (wave.webaim.org): a free browser extension. Scan your menu page and fix the errors flagged in red
• Lighthouse (built into Chrome DevTools): check the "Accessibility" tab. Aim for a score above 90
• axe DevTools: a browser extension that details each error with suggested fixes

These same tools can also help you measure other performance aspects, complementing your digital menu analytics tracking.

Level 2: Manual tests

The remaining 60 to 70% require human verification.

• Keyboard test: unplug your mouse and navigate using only the keyboard. Is every interactive element reachable? Is the focus visible?
• Screen reader test: activate VoiceOver or TalkBack and browse your menu with your eyes closed. Can you understand what's being announced? Could you order a dish?
• Zoom test: zoom to 200% in your browser. Does the content remain readable and navigable?
• Contrast test: check every text/background combination with a contrast tool
• Comprehension test: ask someone unfamiliar with your menu to browse it. Do they understand every item?

Level 3: Professional audit

For certified compliance, bring in a digital accessibility expert. A full accessibility audit typically costs between £1,700 and £4,200 (approximately $2,200–$5,500) for a simple site. It's an investment, but it protects you legally and gives you a clear roadmap.

Some local authorities and chambers of commerce offer financial support for digital accessibility in small businesses. Check with your local business support organisation.

Digital menu and disability: beyond compliance, it's about customer experience

Making your restaurant menu accessible isn't just a legal obligation or a risk to manage. It's an approach that improves the experience for all your customers.

Accessibility benefits everyone

The principles of accessibility — high contrast, readable text, clear navigation, logical structure — benefit every user:

• The 65-year-old customer who forgot their reading glasses
• The tourist checking your menu in bright sunlight on your terrace
• The parent holding a child with one arm and scrolling with a thumb
• The customer in a hurry who wants to quickly find gluten-free dishes
• The person with temporary tendinitis who struggles to use their screen

By working on accessibility, you improve readability, usability, and browsing speed for everyone. It's one of the often underestimated advantages of contactless menus.

A genuine commercial argument

People with disabilities don't dine alone. A customer in a wheelchair comes with their family, friends, or colleagues. If your restaurant is accessible — physically and digitally — you attract the entire group. If your digital menu is unusable, the whole group will go elsewhere.

Similarly, companies and organisations planning group meals prioritise accessible venues. It's an explicit selection criterion in many corporate procurement processes.

Positive brand image

Showcasing your accessibility efforts — without turning it into flashy marketing — strengthens your reputation. A simple icon on your shopfront, a mention on your website, trained staff: these subtle signals show that you've thought about every customer.

💡 Good to know: ALaCarte.Direct offers free digital restaurant menu creation via QR code. The generated menu is in native HTML format, with semantic structure that facilitates screen reader compatibility and adaptation to different screen sizes — a solid starting point for your accessibility journey.

Accessibility checklist for your digital menu

Before we wrap up, here's a summary checklist you can print out and pin up in your office. Tick off each point for your current menu.

Structure and content:

• The menu is in HTML format (not a PDF or image)
• Categories use hierarchical headings (h2, h3)
• Each dish has a name, description, and price in selectable text
• Allergens are indicated in text, not solely through icons or colours
• The language is clear and technical terms are explained

Visual design and contrast:

• The text-to-background contrast ratio is above 4.5:1
• The menu remains readable at 200% zoom
• Information never relies solely on colour
• Animations can be disabled or respect prefers-reduced-motion

Navigation and interaction:

• Every interactive element is at least 44 × 44 pixels
• Keyboard navigation works (Tab, Shift+Tab, Enter)
• Keyboard focus is visible
• No auto-playing audio or video
• Session timeouts are long enough

Images and media:

• Every informational image has relevant alt text
• Decorative images are marked as such
• Videos have subtitles
• Audio content has a transcript

Forms (if online ordering is available):

• Every field has an explicit, permanent label
• Errors are described in text and positioned near the relevant field
• The form is usable via keyboard

Conclusion: take action this week

Digital menu accessibility isn't a mammoth project requiring months of development. It's a series of checks and adjustments you can start immediately.

This week, do these three things:

1. Test your menu with a screen reader (5 minutes). Activate VoiceOver or TalkBack on your phone and try browsing your menu. If the result is incomprehensible, you know there's an urgent issue to address.

2. Check your contrast (10 minutes). Run your menu page through the WAVE tool. Fix the contrast errors flagged in red — it's often just a simple colour change.

3. Eliminate inaccessible formats (varies). If your menu is a PDF or an image, this is your number one priority. Switch to a QR code digital menu in HTML format to lay the foundation for an accessible menu.

This month:

• Work through the checklist above and address every non-compliant point
• Train your staff to offer an alternative when a customer has difficulty with the digital menu
• Review the accessibility standards for public premises to ensure consistency between your physical and digital accessibility

Accessibility isn't an additional constraint. It's the logical continuation of what you already do every day: welcoming every customer and giving them the best possible experience. Your digital menu should uphold that same standard.