Accessibility
Accessibility Report
How Food Info conforms to WCAG 2.1 Level AA, how we test for it, and how to flag a barrier you've run into.
Last audited:
Conformance status
The Web Content Accessibility Guidelines (WCAG) define requirements for designers and developers to improve accessibility for people with disabilities. They define three levels of conformance: A, AA, and AAA. Food Info is fully conformant with WCAG 2.1 Level AA, meaning the content satisfies all the Level A and Level AA success criteria.
How we test
- Automated audits run against every public route using axe-core (current major version) via pa11y, with the
wcag2a,wcag2aa,wcag21a, andwcag21aarule sets enabled. - Manual review covers items automated tools can't reliably check: heading hierarchy, ARIA correctness, keyboard navigation including focus order, visible focus indicators, screen-reader landmark announcements, page titles, and the document language attribute.
- Colour-contrast minimums (4.5:1 for body text, 3:1 for large text and UI components) are enforced through the design-token palette so future surfaces inherit conformant colours by default.
Accessibility features
- Skip-to-content link as the first focusable element.
- Single visible focus indicator (2 px outline + 2 px offset) on every interactive control, including native
<select>wrappers. - Keyboard focus moves to the new page heading after every route change, so screen-reader and keyboard-only users start each page from a sensible place.
- Light and dark themes, both meeting the AA contrast threshold; respects the operating system preference until overridden.
- Every text size uses relative units (
rem) so the page scales fully with the browser's font-size preference, including a doubled (200 %) zoom. - All animations and transitions are suppressed for visitors with the operating-system "Reduce motion" preference enabled.
- Form fields use real
<label>elements; inline errors are linked to their inputs viaaria-describedbyand announced viarole="alert"; required fields carry a visible indicator. - Every password field has a "show password" toggle whose state is exposed via
aria-pressed. - The search dropdown is a WAI-ARIA combobox with arrow-key navigation,
aria-controls/aria-activedescendantwiring, Enter to select, Escape to close. - Dialogs trap keyboard focus while open, close on Escape, and restore focus to the element that opened them.
- All decorative imagery is marked
aria-hidden; meaningful text alternatives accompany the rest. Inline SVG icons carryfocusable="false"so they never receive keyboard focus. - Foreign-language food descriptions (French Ciqual, the Danish Food Composition Database, Australian AUSNUT, etc.) carry a
langattribute so screen readers switch pronunciation.
Known limitations
None at the time of the last audit. If you find a barrier we've missed, please report it via the contact details below.
Reporting an issue
We're committed to fixing accessibility barriers. If something on this site isn't working for you, page elements that fail to render with a screen reader, colour combinations that are hard to read, anything keyboard-only navigation can't reach, we want to hear about it.
- Email:
infofood-info.org - Phone:+44 (0) 7305 438083
- Post: DCPNET LTD, 30 Vane Close, Norwich, NR7 0US, United Kingdom
We aim to acknowledge accessibility reports within two working days and to publish a fix or workaround within ten.