Example
Adding alt text to images and ensuring sufficient colour contrast so screen-reader and low-vision users can navigate a site.
98.1% of home pages have at least one WCAG 2 failure, according to the WebAIM Million annual accessibility report.
What it applies to
Every public-facing website. Accessibility is both a legal requirement in many countries and a quality signal that benefits all users — not just those with disabilities.
Core areas to address
- Visual: Ensure colour contrast ratios meet WCAG AA minimums (4.5:1 for body text). Use tools like the WebAIM Contrast Checker to verify every text/background combination.
- Images: Add descriptive alt text to every meaningful image. Decorative images should have an empty alt attribute (alt="") so screen readers skip them.
- Forms: Every input must have an associated <label> element — not just placeholder text, which disappears on input.
- Keyboard navigation: Tab through your entire site without a mouse. Every interactive element (links, buttons, forms) must be reachable and operable by keyboard alone.
- Headings: Use a logical H1 → H2 → H3 hierarchy. Never skip levels. Screen readers use headings to navigate page content.
How to audit
- Run Google Lighthouse (built into Chrome DevTools) — the Accessibility score flags the most common issues automatically.
- Install the axe DevTools browser extension for a deeper, annotated audit.
- Test with a screen reader (VoiceOver on Mac, NVDA on Windows) to experience the page as a visually impaired user would.
In Webflow
Webflow provides alt text fields for all images, ARIA label fields on interactive elements, and semantic HTML output. Enable the Accessibility panel in the Designer to catch common issues during build.
%20(1).png)