Skip to content

Web & Digital Experience

Accessibility: checked the way people actually use the page

An automated scanner catches some problems, like missing labels and low contrast. It can't tell you that the time slots on your booking form can't be reached without a mouse, or that a screen reader reads them as “group, group, group”. We check pages the way people use them: by keyboard, with a screen reader, zoomed in and with motion turned off. Then we fix what we find.
Book a visitnamephonepreferred timeMon amMon pmTue amTue pmWed amWed pmBook visitkeyboardscreen reader200% zoomreduced motiontime slots skipped · not reachableslots rebuilt as buttons · reachable1 name · 2 phone · 3 Tue am · 4 Book visit“Name, edit text, required”“Phone, edit text, required”“Preferred time, group, 6 options”“Tuesday morning, button, selected”“Book visit, button”one column, nothing scrolls sidewaysconfirmation appears without sliding

Five ways people use a page

Each one is checked by doing it, on the real page.
Keyboard onlyevery action reachable, in order, with focus visiblecustom controls a mouse can click and a keyboard can't reach
Screen readerevery control named, every change announcedbuttons read as “button”, images read by file name
Zoom and large textreadable at 200 %, one column, no sideways scrollingtext cut off inside fixed-height boxes
Reduced motionanimation off when the visitor askssliding panels that can't be stopped
Touchtargets big enough and far enough aparttiny close buttons next to links

What every page needs

  1. 01

    Meaningful structure

    Headings, labels, landmarks

    A screen reader user can jump by heading and hear what each field is for.

  2. 02

    Keyboard

    Everything without a mouse

    Reachable in order, focus always visible, no traps.

  3. 03

    Contrast

    Readable in sunlight

    Text and controls stand out from their background, checked for every colour pair.

  4. 04

    Motion

    Off when asked

    Animation respects the visitor's setting and never carries meaning on its own.

  5. 05

    Touch targets

    Big enough for a thumb

    Buttons and links sized and spaced so the wrong one isn't tapped.

  6. 06

    Plain language

    Errors that say how to fix them

    “Phone number needs 10 digits”, not “Invalid input”.

One issue, found and fixed

A booking form that passed an automated scan and still couldn't be used with a keyboard.

Booking form · time slots

  1. Scanner run

    no errors reported

    done
  2. Keyboard check

    time slots can't be reached

    failed
  3. Screen reader check

    slots read as group

    failed
  4. Logged

    with steps to reproduce

    done

A scanner said the form was fine. People using a keyboard couldn't have booked.

What accessibility work hands off

In

Pages
and their components
Guidelines
the published standard
People
keyboard, screen reader, zoom, touch
Accessibility
check, fix, check again

Out

Fixes
in the shared components
Checks
on every release
A statement
what's been checked, and how

Worth doing on every page people need to use

Good fit

  • People book, buy or sign in on your site.
  • Your customers include older people, or people on phones in poor light.
  • Nobody has ever tried your site by keyboard or with a screen reader.

Not the right fit

  • You need a legal opinion on compliance. That's a lawyer's call; we report what we checked.
  • A page nobody needs to act on. It still gets the basics, but a full check can wait.

Questions about accessibility

Will this make us compliant?

We check against the published accessibility guidelines and report what passes, what doesn't and what we fixed. Whether that meets a legal requirement is a question for your lawyer.

Isn't an automated scan enough?

It's a start. Scanners catch missing labels and low contrast; they can't tell whether a form can actually be completed by keyboard or with a screen reader.

Do accessibility overlay widgets work?

Add-on widgets that claim to fix a site automatically don't change the page underneath. We fix the page itself.

Does accessible mean plain-looking?

No. Contrast, focus and structure are design decisions like any other, and they can look good.