Taste the Keys, Key Largo Restaurant Month

The Challenge

Taste the Keys is the Key Largo Chamber of Commerce’s restaurant month. Every October, local restaurants put out special menus, the Chamber runs a Trolley Foodie Tour, and diners vote for the best dish in the Signature Dish Showdown. The website has one job: get people to the menus and get them on the trolley.

The old site was WordPress on GoDaddy with a music-venue theme, Elementor, Slider Revolution running a single static slide, and a pile of plugins that mostly did nothing, WooCommerce included. An accessibility audit turned up the usual damage and then some. Around 80 images had empty alt text, including every restaurant logo on the Locations page. White text sat on the brand teal at about 2.3 to 1 contrast. Headings jumped from h1 to h3 to h5, the mobile menu and photo lightbox couldn’t be used with a keyboard, there was no skip link, and the nav links were 12 pixels tall. The Showdown page told people to vote online, and there was nowhere to vote.

The Build

We rebuilt it in Astro 5 with strict TypeScript, as a fully static site. Restaurants, dishes, news, partners, tour dates and the photo gallery all live in content collections, so a new menu is a markdown file, not a page build. The site launched with 23 menu pages and has grown as restaurants signed on through October.

Every issue in the audit got fixed: real alt text on every logo, a clean heading outline, dark text on the teal, a focus-trapped menu and lightbox, a skip link, star ratings spelled out in text, a countdown screen readers can read, reduced-motion support, and tap targets of at least 24 pixels. A later readability pass bumped body text from 15 to 18 pixels for the older crowd that actually reads restaurant month menus.

For ticket sales, the trolley tour got an announcement bar, “Trolley stop” badges on each participating restaurant, and tagged links that report ticket clicks to GA4. The Showdown page now points at the Chamber’s real online ballot. Each page has its own share image, plus FoodEvent, Restaurant and FAQ structured data and an llms.txt file built from the same content.

Chamber staff send in changes, they get made against a written editing guide, and every push to main rebuilds and publishes on Netlify. During restaurant month that’s a lot of pushes: new dishes, price changes, late menus.

The Result

The heaviest page ships about 1.4 KB of JavaScript. Restaurant logos and graphics dropped from roughly 10 MB to 1.4 MB. axe-core finds zero WCAG 2.2 AA violations on every route at desktop, phone and small-phone widths, and all 30 keyboard checks pass. The Chamber updates menus during the month it matters most, and diners can actually vote.