Accessibility

WCAG 2.2 AA, translated for general practice.

Accessibility is a legal requirement for practice websites and a practical one: the patients most likely to struggle with a website are often the ones who most need the service behind it. Here is what to build, and what to check.

Ryan MillerFounder, Simpliy Primary Care — working in NHS primary care practice managementLast reviewed

New in 2.2

The criteria that catch GP websites out

WCAG 2.2 added success criteria that particularly affect the components practice sites tend to use — sticky headers, chat widgets, maps and forms.

Focus not obscured (minimum)

When someone tabs through the page, the focused element must not be hidden behind a sticky header, cookie bar or chat widget.

In practice: Sticky practice headers and live chat bubbles are the usual culprits on GP websites.

Dragging movements

Anything that works by dragging needs a single-pointer alternative.

In practice: Affects carousels and map controls used on 'find us' pages.

Target size (minimum)

Interactive targets need to be large enough to hit reliably, with spacing between them.

In practice: Matters on appointment and prescription buttons used on small phones.

Consistent help

Help mechanisms — contact details, chat, help links — should appear in the same relative place on every page.

In practice: Put the reception phone number in a consistent position sitewide.

Redundant entry

Do not make people re-enter information they have already given in the same process.

In practice: Applies to multi-step registration and feedback forms.

Accessible authentication (minimum)

Do not require a cognitive test such as remembering a puzzle to log in.

In practice: Relevant where a patient area or online form sits behind a login.

Checklist

Ten checks you can run this afternoon

None of these need specialist software. A keyboard, a browser zoom control and ten minutes will find most real problems.

  1. Every page has one H1 and a logical heading order beneath it.
  2. Colour is never the only way information is conveyed.
  3. Text contrast meets 4.5:1, and 3:1 for large text and interface components.
  4. The site is fully operable with a keyboard, with a visible focus indicator.
  5. A skip-to-content link is the first focusable element.
  6. Images carry meaningful alternative text; decorative images are hidden from screen readers.
  7. Forms have visible labels and errors described in text, not just colour.
  8. The page reflows without horizontal scrolling at 400% zoom.
  9. Motion respects the reduced-motion preference.
  10. PDFs are avoided where an HTML page would do the same job.

Questions

Frequently asked questions