Accessibility is not a layer applied to a finished interface. It is whether what you built can be operated by someone not driving it the way you did — by keyboard, by voice, at 400% zoom, on a phone in the sun. Most of the work is choosing markup that already carries meaning; a smaller part is filling gaps markup cannot express; the stubborn part is focus, which nothing does for you. The standards read like a checklist, and reading them that way is the mistake this guide is written against.
Each chapter opens with the short version. Tap one to read the detail.
What it is, and what a conformance claim asserts
~2 min
Barriers are situational as often as permanent: a broken arm, bright sun and a small screen break the same designs. Requirements sit under four principles — perceivable, operable, understandable, robust. Conformance is all-or-nothing per page and per process, which is why the checklist framing misleads.
Name, role, value — and where a name comes from
~3 min
The browser builds an accessibility tree and exposes it to assistive software. Every component must expose a name, a role and its state — which native elements already do; ARIA changes only what an element claims to be, adding no focus and no key handling. The name comes from a fixed cascade.
Structure is the interface
~2 min
Whatever a relationship looks like, it must also exist in markup: headings as headings, lists as lists, cells tied to their headers. Instructions cannot lean on shape, colour, size or position alone, and the page's language must be declared or pronunciation is guesswork.
Images and media: serve the purpose, not the appearance
~2 min
A text alternative serves the same purpose the content serves — a different question from describing how it looks. A functional image is named for what it does, a decorative one marked so assistive software skips it, and captions carry sound, not only dialogue.
Presentation the user is allowed to change
~2 min
Contrast is a luminance ratio, not a judgement call: 4.5:1 for body text, 3:1 for large text, and 3:1 for the borders and focus rings that let you find a control. Separately, layout must survive 400% zoom without forcing you to scroll in two directions.
Keyboard operability, and the focus ring you deleted
~2 min
Every function must be reachable from a keyboard, focus must never get stuck, and the indicator must stay visible — removing the outline with no replacement is how shipped CSS usually breaks this. Repeated blocks need a bypass, and a focused control must not be entirely hidden.
Custom widgets: the contract you signed
~2 min
Building a dialog, a tab set or a combobox means taking on its whole keyboard contract, not just its roles. A composite widget is one tab stop with arrow keys inside. Content that changes without moving focus must be announced through a live region, or nobody hears it.
Forms, errors, and no surprises
~2 min
Labels must be there for everyone, errors described in words rather than a red outline, and nothing may change context merely because a control received focus. Sign-in counts too: forcing people to memorise or transcribe, or blocking paste, has its own criterion.
Touch, motion, and time
~2 min
Any path-based or multi-finger gesture needs a single-pointer alternative, and targets want 24 by 24 CSS pixels or equivalent spacing. Time limits must be adjustable, flashing is capped at three per second, and interaction-triggered motion should honour the reduce-motion setting.
Testing: drive it the way people actually do
~2 min
No tool can decide whether a site conforms; knowledgeable human evaluation is required. A checker proves an attribute exists, never that it means anything. The real test is driving the page as people do — keyboard only, at 400% zoom, by voice — and reading the name and role exposed.
Written by Keentune. We are not affiliated with or endorsed by the organizations whose documentation informs this guide, and any linked sources belong to their respective owners.
All exam, test, and product names and trademarks are the property of their respective owners and are used here for identification and reference only. Keentune is independent study practice — not affiliated with, authorized, or endorsed by any of these organizations.