Accessibility (overview)

What is web accessibility?

Accessibility (often shortened to a11y) means designing products so that people with the full range of abilities - including disabilities of vision, hearing, motor control and cognition - can perceive, operate and understand them. The WCAG standard frames it as four principles, POUR: content must be Perceivable, Operable, Understandable and Robust, for everyone, not just the able-bodied "average" user.

Also known as: accessibility, web accessibility, a11y

Prefer to watch? Watch the recap 1:25

The demo

Accessibility, made concrete. The WCAG model boils down to four principles - POUR. Tap each to see what it means and a quick before/after, so “make it accessible” turns into four things you can do.

What this demo shows (text version)

The four WCAG principles - Perceivable, Operable, Understandable, Robust (POUR) - are shown as tabs, each with a short explanation and a "broken vs accessible" example. Perceivable: an image with no alt text (invisible to screen readers) versus one with a description. Operable: a control only usable with a mouse versus one fully keyboard-operable. Understandable: a vague error ("Error 0x4") versus a clear, helpful one. Robust: non-semantic markup that confuses assistive tech versus valid, semantic HTML that works with it.

That's accessibility in overview: designing so people with the full range of abilities can perceive, operate and understand a product, framed by WCAG's POUR principles. It's a legal requirement, an ethical duty, and - through the curb-cut effect - better for everyone. Build it in from the start as a baseline rather than bolting it on at the end.

Accessibility is making products usable by people with disabilities - and the WCAG "POUR" principles give it structure. Perceivable: people must be able to perceive the content (alt text for images, captions for video, sufficient contrast, not relying on colour alone). Operable: they must be able to operate the interface (full keyboard access, no keyboard traps, enough time, no seizure-inducing flashes). Understandable: content and operation must make sense (clear language, predictable behaviour, helpful errors). Robust: it must work with assistive technologies like screen readers (valid, semantic code). It's a legal requirement in many places, an ethical duty, and - via the curb-cut effect - it makes products better for everyone. Treat it as a baseline you design in from the start, not a checkbox bolted on at the end.

The Web Content Accessibility Guidelines (WCAG) organise accessibility under four principles - POUR. Perceivable: information must be presentable in ways all users can perceive (text alternatives for images, captions and transcripts for media, sufficient colour contrast, not conveying meaning by colour alone, content that adapts to zoom and assistive tech). Operable: all functionality must be usable by everyone (complete keyboard operability, no keyboard traps, adequate time limits, no flashing that could cause seizures, clear navigation and focus).

Understandable: content and interface must be comprehensible and predictable (clear, plain language; consistent, predictable behaviour; labelled inputs; helpful, specific error messages and recovery). Robust: content must work reliably across browsers, devices and assistive technologies now and in future, which depends on valid, semantic markup and proper use of accessible names and roles (ARIA only where needed). WCAG also defines conformance levels A, AA and AAA.

Accessibility matters on three fronts at once. Legally, it's required in many jurisdictions (equality and anti-discrimination law, public-sector and increasingly private-sector mandates). Ethically, excluding people from essential services is unjust. And practically, accessible design benefits everyone - captions in noisy rooms, keyboard use for power users, clear language for all - the curb-cut effect. It's most effective, and far cheaper, when designed in from the start as a baseline rather than retrofitted, and it overlaps with inclusive design as the broader mindset.