Website accessibility.

Why accessibility matters (three reasons, all real)

It's the right thing to do, and it's a huge market. Around 16 million people in the UK have a disability — roughly one in five. Add temporary impairments (a broken arm, a bright day washing out a screen) and situational ones (using a phone one-handed on a train), and accessible design helps almost everyone at some point. An inaccessible site simply turns paying customers away at the door.

It's a legal duty. Public-sector websites must meet WCAG 2.2 AA by law. For private businesses, the Equality Act 2010 requires "reasonable adjustments" so disabled people aren't put at a substantial disadvantage — and that has been interpreted to cover websites. Accessibility-related legal complaints against businesses are rising, and "we didn't know" is not a defence.

It makes the site better for everyone. This is the part people miss. Accessible sites are clearer, faster to use, better structured and easier for search engines to understand. The captions that help deaf users also help anyone watching without sound; the clear labels that help screen-reader users reduce mistakes for everyone; the semantic structure that helps assistive technology also helps Google. Accessibility and quality point the same way.

WCAG 2.2 and the four principles (POUR)

The Web Content Accessibility Guidelines are the international standard, and version 2.2 is current. They're built on four principles — the acronym is POUR:

WCAG has three conformance levels: A (minimum), AA (the standard almost everyone targets and the legal benchmark), and AAA (enhanced, rarely required in full). AA is the goal for virtually every business site. WCAG 2.2 added a handful of newer criteria around focus visibility, dragging alternatives, and target sizes for touch — reflecting how people actually use sites now.

Colour and contrast

Low-contrast text — light grey on white, thin type on a busy background — is one of the commonest and easiest-to-fix accessibility failures. It affects people with low vision, colour-blindness (around 1 in 12 men), and anyone using a screen in sunlight.

WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. You don't have to eyeball it — free checkers (WebAIM's contrast checker, or the tools built into browser DevTools) give you the exact ratio. And crucially: never rely on colour alone to convey meaning. A form field that only turns red to show an error is invisible to a colour-blind user — pair it with an icon and a text message.

Keyboard navigation and focus

Many people can't or don't use a mouse — motor impairments, screen-reader users, and plenty of power users navigate entirely by keyboard. The test is simple and you can do it right now: put your mouse away and try to use your site with Tab, Enter and the arrow keys. Can you reach every link, button and form field? Can you operate menus and close pop-ups? Does anything trap you?

Two essentials follow. Visible focus states: as you Tab through a page, the element you're on must be clearly outlined, so keyboard users can see where they are — removing focus outlines "for looks" is a classic accessibility own-goal. And skip links: a "skip to main content" link (the first thing keyboard users hit) lets them jump past the navigation instead of tabbing through it on every page. Both are small additions with a big impact.

Screen readers, alt text and semantic HTML

Screen readers turn a page into speech (or Braille) for blind and low-vision users. What they can convey depends entirely on how the page is built:

Semantic HTML is the foundation. Using the right element for the job — headings for headings, buttons for buttons, lists for lists, landmarks for page regions — lets a screen reader announce structure and lets users navigate by it ("jump to the next heading"). A page built from meaningless divs styled to look like buttons is a screen-reader nightmare. This is where accessibility and development standards are the same conversation.

Alt text describes images for people who can't see them. Good alt text conveys the image's purpose concisely — "Gas Safe registered engineer servicing a boiler", not "image1.jpg" and not a keyword-stuffed paragraph. Decorative images that add nothing should have empty alt text so screen readers skip them. Alt text also helps SEO, since it's how search engines understand images.

Headings in order — one H1, then H2s, then H3s, without skipping levels — give both screen readers and search engines the document's structure. Don't pick heading levels for their size; pick them for their meaning and style with CSS.

Accessible forms, menus and PDFs

Forms

Forms are where accessibility failures cost you money directly — an inaccessible form is a lost enquiry or sale. Every field needs a proper label (not just placeholder text, which vanishes when you type). Errors must be clearly described in text, not just colour. Group related fields, keep it short, and make sure the whole thing works by keyboard. Our conversion guide makes the same point from the sales angle: accessible forms convert better for everyone.

Menus and interactive components

Dropdown menus, accordions, tabs, modals and carousels are where accessibility most often breaks, because they're custom-built. Each needs to be operable by keyboard, announce its state to screen readers (expanded/collapsed, selected), and manage focus sensibly. If you use a component library, check it's built accessibly rather than assuming.

PDFs and documents

An often-forgotten gap: PDFs linked from your site (menus, brochures, forms) need to be accessible too — properly tagged, with real text rather than scanned images, and a logical reading order. A beautifully accessible website undermined by an unreadable PDF menu still fails the customer.

The SEO, legal and conversion payoff

Accessibility is often sold purely as compliance, which undersells it. The overlap with other goals is substantial:

So the business case stacks up three ways: you reach a fifth more of the market, you reduce genuine legal risk, and you improve SEO and conversion for every visitor — disabled or not. Few investments in a website pay back across so many dimensions at once.

How to check and improve your site's accessibility

A pragmatic path, from free-and-fast to thorough:

Automated checks catch maybe 30–40% of issues instantly — missing alt text, contrast failures, missing labels, structural problems. Free tools like WAVE (wave.webaim.org) and the Lighthouse accessibility audit in Chrome are a good starting point. Our website checker flags some of the common signals.

Manual testing catches the rest, and it's mostly free: navigate by keyboard only, try a screen reader (built into every operating system — VoiceOver on Mac, Narrator on Windows), check contrast, and read the page with images and CSS disabled. An hour of manual testing reveals more than any automated tool.

Professional audit for sites where the stakes are high — public sector, large e-commerce, anything legally exposed — a proper WCAG 2.2 audit by someone experienced is worth it. But most small business sites can reach a genuinely good standard through the essentials in this guide, built in from the start rather than retrofitted.

Frequently asked questions

What is website accessibility?

Building websites that people with disabilities can use — including those who navigate by keyboard, use screen readers, have low vision or colour-blindness, or have motor or cognitive differences. The standard is WCAG 2.2, and the practical goal is a site everyone can perceive, operate and understand.

What is WCAG 2.2?

The current version of the Web Content Accessibility Guidelines, the international standard for web accessibility. It's organised around four principles — Perceivable, Operable, Understandable, Robust — with three conformance levels, of which AA is the benchmark almost every business should target.

Is website accessibility a legal requirement in the UK?

For public-sector sites, yes — they must meet WCAG 2.2 AA by law. For private businesses, the Equality Act 2010 requires reasonable adjustments so disabled people aren't substantially disadvantaged, which has been interpreted to cover websites. Accessibility complaints against businesses are rising.

What contrast ratio do I need for accessibility?

WCAG AA requires at least 4.5:1 for normal text and 3:1 for large text. Free contrast checkers give you the exact ratio. Never rely on colour alone to convey meaning — pair it with text or icons, since around one in twelve men is colour-blind.

What is alt text and how do I write it?

Alt text is a written description of an image for people who can't see it, read aloud by screen readers. Write it to convey the image's purpose concisely — 'Gas Safe engineer servicing a boiler', not a filename or keyword stuffing. Decorative images should have empty alt text so screen readers skip them. It also helps SEO.

How do I test if my website is keyboard accessible?

Put your mouse away and navigate using Tab, Enter and the arrow keys. Check you can reach every link, button and form field, operate menus, close pop-ups, and that nothing traps you. Make sure the focused element is always clearly outlined so you can see where you are.

What are skip links?

A 'skip to main content' link, usually the first thing on the page, that lets keyboard and screen-reader users jump past the navigation instead of tabbing through it on every page. It's a small addition with a big usability benefit for those users.

Why is semantic HTML important for accessibility?

Screen readers rely on proper HTML elements to convey structure — headings, buttons, lists and landmarks let users navigate and understand the page. A site built from generic divs styled to look like interface elements is very hard to use with assistive technology, and worse for SEO too.

Do PDFs need to be accessible?

Yes — PDFs linked from your site, like menus, brochures and forms, need to be properly tagged with real text (not scanned images) and a logical reading order. An accessible website undermined by an unreadable PDF still fails the customer trying to use it.

Does accessibility help SEO?

Considerably. Alt text aids image understanding, semantic HTML and heading structure help search engines parse content, readable text and fast pages help rankings and Core Web Vitals, and clear structure helps AI systems extract and cite your content. Accessibility and SEO reinforce each other.

How much of accessibility can automated tools check?

Automated tools catch roughly 30–40% of issues — missing alt text, contrast failures, missing labels, structural problems. The rest needs manual testing: keyboard navigation, a screen reader, and checking real usability. Both together give a reliable picture.

Can I make my existing website accessible, or do I need a rebuild?

Many accessibility issues can be fixed on an existing site — contrast, alt text, labels, focus states, semantic corrections. Deeply inaccessible sites built on poor foundations are sometimes cheaper to rebuild properly. A quick audit tells you which situation you're in.

Related: Development standards · UX design · Conversion optimisation · Health checker