Customers with food allergies should find what’s in a dish within a few taps. When food website allergen information sits where people already look, they can order with confidence. Diners who can’t find the details often ring ahead or book elsewhere.
Many venues publish allergen details, but often in a PDF under a footer link. Nobody has touched that file since the last menu change. At Spoon Fed Atlanta, we see the gap as a design problem. Most kitchens already hold the right details, so the fix lies in where and how they appear online.
Good food allergy website UX protects diners, since a single allergic reaction can end in a trip to the emergency department. In this guide, you’ll learn where allergen details belong on your site and how to lay out a menu for fast scanning and screen readers. We also cover why an outdated menu puts diners at risk and how to keep yours current.
Where Should Allergen Information Sit on a Food Website?
Allergen information should sit wherever a customer decides what to eat. In practice, allergen tags belong on the menu, in site search and in menu filters. A diner who has to hunt for the details has every reason to book elsewhere.
Five spots on your site should carry allergen details, starting with the dish itself.
Put Allergy Tags on the Dish Itself
Allergen tags belong directly under each dish name, in the same block as the price and description. A diner can then read one line and decide on the spot.
Many venues still keep those tags in a PDF instead, which loads slowly and forces pinching and zooming on a phone. Anyone who has squinted at one in a dim pub on a Friday night will know how fast people give up.
Move each allergen list onto the menu page as plain text. We suggest the same fix for clunky menus and other food website mistakes. Keep a PDF only as an optional download for printing.
Add an Allergy Link to the Header and Footer
Some visitors land on your home page with just one question about allergens. A header link labelled “Allergens” answers it before they even scroll. For people who head straight to the bottom of the page, a matching footer link does the same job.
You should point both links at the same page, so there’s only one version to keep current. Keep the label plain too, since clever names such as “Dietary Hub” slow people down when they scan.
Site Search That Understands Food Allergy Terms
Plenty of customers skip the menu and type straight into your site search. If “nut free” returns nothing, they’ll assume you can’t cater for them.
When we test search on food sites, the gaps often come from shorthand like “GF” and plain terms like “coeliac”. Start by typing 10 allergy phrases a customer might use, such as “dairy free” or “no egg”. Each empty result points to a missing tag.
Many website platforms let you add tags to menu items, so map each failed phrase to the right dishes. Run the same 10 searches again afterwards to confirm every phrase now returns results.
A Filter That Hides Dishes With a Chosen Allergen
A filter lets someone tick “sesame” and watch every sesame dish drop off the menu. Parents managing allergies in children often check several menus before choosing a venue. A working filter saves them reading every description on every menu.
Hiding works better than highlighting here, since a shorter list leaves less room for misreading. Highlighted warnings still make the diner check each item one by one.
Build the filter around the allergens Australian food standards require businesses to declare. The list includes peanut, tree nuts, milk, egg, sesame, fish, soy and wheat. Crustacean, mollusc, lupin and gluten-containing cereals belong on the list too. You should add extra options later when customers ask for them.
A Contact Route for Extra Allergy Support
No menu covers every question, such as cross-contact in a shared fryer, a rare allergy or a food intolerance. A contact link right under the allergen list gives those diners somewhere to ask.
The best route depends on timing. A phone number suits urgent questions on the day, while an email or form works for people planning ahead.
Whichever you offer, state when you’ll reply, and promise only a response time your staff can keep every week. That promise counts for a lot with newly diagnosed diners, who often send detailed questions and decide whether to book based on your answer.
Designing a Digital Food Allergen Menu for Quick Reading
With placement sorted, layout decides how fast people can read the details. Good digital allergen menu design lets a diner scan a whole section without opening each dish.
Screen size plays a big part here. Your team probably built the menu on a laptop, but many diners check it on their phones from the tram or the car park. Filter boxes and tags need enough space for a thumb to tap on a screen that size.
Five layout choices will help diners read allergen tags faster on any screen:
- Keep One Tag Order: Allergens listed in the same order on every dish are faster to scan. Nuts first, then dairy, then gluten is one simple order, as long as it never changes between sections.
- Pair Icons With Text Labels: Give every icon a one-word label, such as “Peanuts”. A wheat symbol alone could mean “gluten” to one diner and “wholegrain” to another. Screen readers can also announce the word when the icon carries matching alt text.
- Match Allergen Text Size: Keep allergen text the same size as the description, never smaller. Small type is hard to read on a phone, especially in low light. Test the menu at your phone’s default text setting before each update.
- Add a Short Icon Guide: First-time visitors won’t know your symbols yet. A legend at the top of the menu, with one line per symbol, teaches them quickly. Repeating it beside the filter saves diners a scroll back up.
- Split Trace Warnings Clearly: Diners with severe allergies often avoid both “contains” and “may contain” dishes, while others avoid only the first. Separate labels for each let every person make an informed choice.
Test those five choices on your own phone before you publish any change. If you need to zoom or guess at an icon, your customers will struggle too.
Restaurant Menu Accessibility: Making Allergen Details Work for Screen Readers and Filters
A clean layout helps every diner, but some customers rely on tools that read the page aloud. According to ABS figures on Australians with disability, 5.5 million people (21.4%) had disability in 2022. The number rose from 4.4 million (17.7%) in 2018. Not every person in the group uses a screen reader. Still, the figures show how many diners could benefit from better restaurant menu accessibility.
Thinking about where to begin? The table below pairs three common problems with a fix for each.
| Problem | What happens | Fix |
|---|---|---|
| Icons with no alt text | Screen readers skip the allergen entirely | Add alt text such as “contains peanuts” |
| Allergens shown only by colour | Colour-blind diners miss the warning | Add a text label beside the colour |
| Filters that need a mouse | Keyboard users can’t apply them | Make every checkbox reachable with Tab |
Fix alt text first, since an unlabelled icon leaves a screen reader user with no warning at all. Then test the menu with your phone’s built-in screen reader switched on (VoiceOver on iPhone, TalkBack on most Android phones). Ask one staff member to repeat the test each month so new dishes get checked too.
Outdated Allergen Information Puts Diner Health at Risk
Accessible food website allergen information still fails once the online menu stops matching the kitchen. Picture a diner who reads “nut free” online, orders the dish and reacts to a new pesto. The diner did the right thing by checking first, so the fault lies with the menu.
An outdated listing is a serious food safety failure, even when the kitchen follows every other rule. The FSANZ allergen guidance for food service asks businesses to give clear, current and accurate allergen details for the foods they serve. Your website is one place customers find those details. A stale online menu breaks the same promise as a wrong answer at the counter. State and territory agencies and local councils enforce the Food Standards Code, so check with your council on what applies to you.
Staleness usually creeps in through small swaps. A supplier might change a bread recipe and update the food label. The chef might also swap in a soy-based margarine for a week. In both cases, nobody tells the person who runs the site.
Under Australia’s allergen labelling requirements, packaged foods must show allergens in bold and in a “Contains” summary. Check the labels on every delivery, since suppliers can change ingredients without notice. Treat your website as part of food safety compliance, alongside staff training and kitchen records.
When we review out-of-date menus, one person often owns the recipes and another owns the website, and nothing links the two jobs. The fix is to tie every website update to the moment a recipe changes, and to make allergen management part of the same checklist.
A “last checked” date on the allergen page shows customers that this process is working. Update it only after someone compares every dish against the current ingredient list. A recent date builds trust, while an old one tells diners to call before ordering. To keep those checks sharp, staff can complete the National Allergy Strategy’s free online training for food service.
Start With One Dish and Build From There
Pick your most popular dish this week and give it clear tags, alt text and a check date. Test the page with your phone’s screen reader switched on, then search for the dish using two allergy terms a customer might type.
Once the dish passes both tests, roll the same format across the rest of the menu. Each finished dish gives diners with a food allergy one more option they can trust.
Want help making your allergen details easier to find? Talk to Spoon Fed Atlanta for practical advice on food website design that works for every diner.