Accessibility
Using BeerHQ
What is checked automatically on every page, what is designed in deliberately, and what nobody has verified yet.
Checked on every build
A sweep runs over every generated page and fails the build report on structural problems: page language, a title, one top-level heading, headings in order, alternative text on images, accessible names on links and buttons, labels on form controls, and header cells on tables. It currently reports no structural issues across the whole site.
That is a floor rather than a ceiling. It catches the errors a machine can see.
Designed in deliberately
| Focus is always visible | The focus outline is defined once and is not overridable per component, because removing it is the single most commonly deleted accessibility affordance. |
|---|---|
| Never colour alone | Every beer colour reading carries the band name and the SRM and EBC ranges as text beside the swatch. A reader who cannot distinguish the colours, is using a screen reader, or has printed the page gets the same information. The same rule governs every diagram: the content is in markup beside the drawing, and the drawing is the shortcut. |
| Diagrams carry their meaning in text | Process sequences are ordered lists next to the illustration rather than labels inside it, so a screen reader gets the process rather than the word “diagram”. |
| The age gate is operable without a mouse | The 18+ confirmation is a real dialog with real buttons, focus moves into it, Tab stays inside it, and both answers have the same size and hit area. |
| Reduced motion is respected | Animation and transition durations collapse when the system asks for that. |
| Skip link | The first thing in the tab order on every page skips the navigation. |
What has not been checked
No audit by a person who uses assistive technology daily has taken place. The automated sweep cannot see colour contrast in context, whether the reading order makes sense, or whether the wording is actually clear — and those are the things that decide whether a page is usable rather than merely conformant.
BeerHQ therefore does not claim a WCAG conformance level. Claiming one on the strength of an automated check is how that claim becomes untrue.
If something does not work
hello@hekno.co.uk. What helps most is the page, what you were trying to do, and the browser or assistive technology you were using. An accessibility problem is a correction like any other — see corrections.