Web accessibility means building pages that people with visual, hearing, motor or cognitive disabilities can use, with a screen reader, a keyboard, voice control or magnification. It is a legal duty in more places each year, and it overlaps so much with SEO that most of the work pays off twice.
What is web accessibility, and what is WCAG?
The standard is the Web Content Accessibility Guidelines (WCAG) from the W3C. WCAG 2.2 is a W3C Recommendation, and its current version is dated 12 December 2024. It rests on four principles: content must be perceivable, operable and understandable, and it must work with assistive technology, which is the fourth principle. Each guideline has testable success criteria at three levels: A, AA and AAA. Most laws and contracts ask for level AA.
WCAG 2.2 added nine success criteria to 2.1 and removed one (4.1.1 Parsing). The new ones that matter most for a normal site:
| Criterion | Level | What it asks |
|---|---|---|
| 2.4.11 Focus Not Obscured (Minimum) | AA | The keyboard focus is not fully hidden behind sticky bars or banners |
| 2.5.7 Dragging Movements | AA | Anything done by dragging also works with a single tap or click |
| 2.5.8 Target Size (Minimum) | AA | Buttons and links are big enough to hit |
| 3.2.6 Consistent Help | A | Help links sit in the same place across pages |
| 3.3.7 Redundant Entry | A | Do not make people retype information they already gave |
| 3.3.8 Accessible Authentication (Minimum) | AA | Logging in does not rely on a memory or puzzle test alone |
Why does accessibility matter for SEO?
Google does not rank pages by an accessibility score. The overlap comes from the work itself, and Google’s SEO Starter Guide touches it directly: semantic heading order helps screen readers, descriptive alt text describes images, and well-organized text with clear sections helps people navigate.
| Accessibility fix | SEO effect |
|---|---|
| Descriptive alt text | Google understands the image and uses it as anchor text for image links |
| Logical heading structure | Clear outline for screen readers and for Google |
| Descriptive link text (see internal linking) | Anchor text tells Google what the target page is about |
| Readable text and layout (see readability) | Visitors stay and read |
| Captions and transcripts | Text for Google and AI to read from audio and video |
| Fast, stable pages (see Core Web Vitals) | Better experience on slow devices |
Add the law and the market. The European Commission says the European Accessibility Act applies from 28 June 2025, and covers products and services including e-commerce, banking services, e-books and passenger transport services. Online shops that sell to EU customers need to check it. The Commission states that micro-enterprises that provide services are exempt (fewer than 10 staff, and turnover or balance sheet under 2 million euros under the directive). Each EU country wrote its own national law, so check the local rules. The technical standard referred to is EN 301 549, which points to WCAG 2.1 level AA, and aiming at WCAG 2.2 AA covers it.
This page is a practical guide, not legal advice.
How do you make a site accessible, step by step?
- Test with a keyboard. Press Tab through your busiest pages. Can you reach every link, menu and button, see where focus is, and leave a pop-up with Esc?
- Run an automated scan. WAVE, Lighthouse or axe catch missing alt text, low contrast, empty links and unlabeled form fields. Automated tools find only part of the issues, so continue with manual checks.
- Fix text contrast. WCAG AA asks for a contrast ratio of at least 4.5 to 1 for normal text and 3 to 1 for large text.
- Add alt text to meaningful images and leave
alt=""on decorative ones. - Use real headings, lists, buttons and labels. Use
<button>for actions and<a href>for links, and tie every form field to a<label>. - Write descriptive link text. “Read the pricing guide” beats “click here” for screen-reader users and for Google.
- Add captions and transcripts to video and audio (see video SEO).
- Check mobile. Make tap targets large enough, and let people zoom (see intrusive interstitials for pop-ups that block the page).
- Test with a screen reader for ten minutes: NVDA on Windows or VoiceOver on a Mac or iPhone.
- Publish an accessibility statement with a contact for reporting problems, and fix reports quickly.
How do you measure the result?
- Lighthouse accessibility score per template, tracked after each release.
- WAVE or axe error counts on your top 10 pages, trending to zero.
- A manual checklist against WCAG 2.2 AA for the flows that earn money: sign-up, checkout, contact.
- Search and behaviour: the usual Search Console clicks and your engagement rate on pages you fixed.
A 100 score in Lighthouse does not mean the site is accessible, because the tool checks only the rules it can test by machine.
What mistakes should you avoid?
- Overlay widgets. A script that promises one-click compliance does not repair broken markup underneath it.
- Alt text stuffed with keywords. Describe the image for a person who cannot see it.
- Colour as the only signal. Red text alone for an error fails people with colour blindness.
- Pop-ups that trap focus or cannot be closed with the keyboard.
- Treating it as a one-off. Every new template, plugin and campaign page can add new failures.
- Hiding content with
display:nonethat screen readers need, or showing content only on hover.
Where can you learn more?
The free landing page module of the Fe/male Switch startup school covers page design for clarity and conversion, which goes hand in hand with accessible layouts. Next steps on SEO100: write proper alt text, then clean up the heading structure of your main pages.