Brewery, winery, distillery and bar website accessibility: age gates, tap lists, events and online shops

Accessibility fixes for breweries, wineries, distilleries, taprooms and bars: age-verification pop-ups, tap and tasting menus as text, event calendars, ticketing, club sign-ups, online shops, hours and directions.

Taproom, tasting room and bar websites are small, but they put a lot in a visitor's way: an age-verification pop-up before anything else, a tap list posted as a photo, an events calendar, ticket sales, a wine or beer club sign-up and an online shop. Visitors who use a screen reader, keyboard, magnifier or voice control can get stuck at the very first step. Here's what to check.

1. The age-verification pop-up

An age gate that a keyboard or screen reader user can't get past blocks your whole site. Make it a real dialog: move focus into it when it opens, give both buttons clear text, keep focus inside until the visitor answers, and return them to the page afterwards. Don't make the "Yes" option a mouse-only image or a tiny link. (WCAG 4.1.2, WCAG 2.1.1, WCAG 2.4.3)

<div role="dialog" aria-modal="true" aria-labelledby="age-title">
  <h2 id="age-title">Are you 21 or older?</h2>
  <button type="button">Yes, I'm 21 or older</button>
  <button type="button">No</button>
</div>

If you ask for a date of birth instead, give each field a visible label and allow typing; don't rely on three scrolling wheels. Check what your local rules require for age verification; this guide covers only the accessibility of the pop-up.

2. Tap lists, tasting menus and drink menus as text

A chalkboard photo or an Instagram image of today's taps can't be read by a screen reader, and it doesn't zoom well on a phone. Put the list on the page as text or a simple table: name, style, strength and price. If you use a live tap-list widget, check it reads as text and works with the keyboard. (WCAG 1.4.5, WCAG 1.3.1) See accessible tables for prices, hours and menus and menus and PDFs.

<table>
  <caption>On tap today (example values)</caption>
  <tr><th scope="col">Beer</th><th scope="col">Style</th><th scope="col">ABV</th><th scope="col">Pint</th></tr>
  <tr><td>Riverside Pale</td><td>Pale ale</td><td>5.2%</td><td>$7</td></tr>
</table>

3. Photos, labels and logos

Give product and label photos alt text that names the drink ("Riverside Pale Ale, 16 oz can"), and give your logo link the business name. Decorative background photos of barrels or vineyards should use empty alt text. (WCAG 1.1.1) See alt text examples.

4. Events, trivia nights and ticketing

Post events as text with the date, time and price, not only as a flyer image. Calendar widgets and ticket checkouts must work with the keyboard and show sold-out or available dates in words, not colour alone. (WCAG 1.4.1, WCAG 2.5.8) See booking widgets.

5. Club sign-ups, reservations and the online shop

Wine and beer club forms, tasting reservations and shop checkouts need visible labels, autocomplete on name, email and address fields, clear error messages, and no repeated entry of the same address. Logins should allow password managers and pasting, without a puzzle CAPTCHA as the only option. (WCAG 3.3.2, WCAG 1.3.5, WCAG 3.3.1, WCAG 3.3.7, WCAG 3.3.8) See online checkout.

<label for="club-email">Email</label>
<input id="club-email" name="email" type="email" autocomplete="email" required>
<fieldset>
  <legend>Shipment size</legend>
  <label><input type="radio" name="size" value="3"> 3 bottles</label>
  <label><input type="radio" name="size" value="6"> 6 bottles</label>
</fieldset>

6. Hours, directions and access details

Put hours, address and phone number as text with a tel: link, not only in a footer image or a map. Describe your venue factually (for example, "step-free entrance on Main Street, accessible restroom on the ground floor") rather than calling it "fully accessible". (WCAG 2.4.4) See location pages and map embeds.

7. Video, contrast and pop-ups

Caption brewery tours and winemaker videos, and don't auto-play sound. Dark moody designs often use grey text on black; check body text has at least 4.5:1 contrast. Newsletter and "join the club" pop-ups must close with Escape. (WCAG 1.2.2, WCAG 1.4.2, WCAG 1.4.3) See pop-ups and chat widgets.

Common mistakes

A 15-minute check you can do today

  1. Open your site in a private window and get past the age gate using only Tab, Space and Enter.
  2. Find today's tap list or tasting menu and check you can select the text.
  3. Zoom to 200% on a laptop and check the menu, hours and buttons don't overlap.
  4. Start a club sign-up or ticket purchase with the keyboard, leave one required field empty and read the error. Our keyboard test explains what to look for.
  5. Run a free homepage snapshot to catch missing alt text, unnamed buttons, missing labels and low-contrast text.

Platform steps: Squarespace, Wix, WordPress, Shopify. Our scan is automated, so it finds only part of the barriers on this page, and it doesn't test age gates that appear after the first load, ticketing tools, club portals or your physical venue. Related: restaurant websites, wedding and event venue websites, accessibility statement template.

This is general technical guidance, not legal advice, and it doesn't certify compliance with the ADA or any law.

Want the fixes written for you?

Start with a free homepage snapshot. The $149 Fix-Pack scans up to 10 pages and gives copy-paste fixes for your platform within 48 hours, with a 14-day refund promise. See a sample report first.

This is general technical guidance, not legal advice, and it does not certify compliance with the ADA or any law.

Related guides

All guides

This guide is general technical information, not legal advice. Following it does not certify ADA or any legal compliance. Automated checks find only part of accessibility barriers.

Check your own site

Run a free homepage snapshot to see your top 3 issues in about a minute, or order the $149 Fix-Pack for up to 10 pages with copy-paste fixes for your platform.

Get my free snapshot