UK WCAG 2.2 Accessibility Checklist in Practice
UK WCAG 2.2 accessibility checklist in practice
If you work on design or front-end in the UK, you have likely heard that WCAG 2.2 adds new, very practical requirements. This article turns the UK WCAG 2.2 accessibility checklist into concrete UI moves you can apply during discovery, design, and development, without getting lost in abstract standards language.
We will show how to make focus states clearly visible and unobscured, size interactive targets sensibly, avoid drag-only interactions, reduce cognitive load during sign-in, and remove redundant form entry. You will see what to check, what to fix first, and how to test quickly with realistic scenarios.
By the end, you will know which changes are quick wins, which need a sprint, and when it is worth booking a free one-to-one consultation for a simple accessibility plan aligned to your product roadmap.
Your UK WCAG 2.2 accessibility checklist
Use these steps to validate designs and shipped UI. They prioritise the new 2.2 criteria while keeping your AA baseline intact.
UK context: Many UK teams aim for WCAG 2.1 AA or 2.2 AA. Public sector bodies have specific accessibility regulations; most private organisations still benefit from aligning with these standards under the Equality Act by reducing barriers for disabled users.
1) Reconfirm your AA baseline, then layer 2.2 on top
- Keep essentials from earlier versions: colour contrast, keyboard access, visible focus, reflow, text spacing, alt text, form labels, and error feedback.
- Check your components library first. Fixing patterns beats chasing one-off screens.
- Add 2.2-specific checks only after the baseline is stable to avoid regressions.
Key insight: Most 2.2 fixes are small but systemic. Update components once, then retest in context.
2) Focus is obvious and not hidden (2.4.11/12/13)
What good looks like
- A clear, high-contrast focus indicator that stands out from both background and adjacent elements.
- Sticky headers, chat widgets, or cookie banners never cover the focused element.
- On long pages, tabbing keeps the focused control within view without manual scrolling.
- Tab through your page with only the keyboard; verify every interactive element shows a visible, consistent focus style.
- Open and close overlays, banners, and sticky UI while tabbing; confirm focus is never obscured.
- On modals, initial focus lands on a logical control; focus is returned to the trigger when closed.
When to prioritise: If your site uses sticky navigation, floating CTAs, or third‑party chat, fix focus visibility and obstruction first; these cause immediate failures.
3) Target size is comfortably clickable (2.5.8)
Minimums that work in the real world
Make tap targets at least 24 × 24 CSS pixels or provide enough spacing so the effective hit area reaches that size. Group small controls (like pagination or icon-only actions) with sufficient gaps to avoid accidental activation.
- Audit common touch areas: menus, filter chips, checkboxes, radio buttons, close icons, and pagination.
- Increase hit areas using padding or invisible space, not just visual size.
- Check on mobile breakpoints with real thumbs, not just a mouse.
4) No drag-only interactions (2.5.7)
Provide a no‑drag path
- Sortable lists must also support keyboard and click/tap move actions.
- Map or canvas panning needs arrow keys or on-screen controls.
- Sliders get plus/minus or text input alternatives.
- Try completing tasks without a mouse: can you reorder, pan, or adjust values using keys or simple clicks?
- Ensure status messages update for screen readers when non-drag methods are used.
Decision shortcut: For any drag feature, add an equivalent single-pointer and keyboard method. If you cannot, redesign the interaction.
5) Authentication does not test memory (3.3.8/3.3.9)
Reduce cognitive load during sign‑in
- Allow paste into email, username, and password fields; do not block password managers.
- Offer “show password”, magic link, or device biometrics where appropriate.
- Avoid solving puzzles or remembering characters from images to prove you are human.
- Test with a password manager on desktop and mobile.
- Confirm error messages are specific and help the user recover without retyping everything.
- Keep multi‑step sign‑in short and predictable; remember the user on trusted devices when policy allows.
6) No redundant entry in forms (3.3.7)
Remove repeat typing
- Pre‑fill known user data from a previous step or account profile.
- If a shipping address equals billing, one checkbox should copy values.
- Carry validated values across steps; do not ask users to re-enter the same field after an error elsewhere.
- Map each form field to its single source of truth; auto-fill when available.
- Use accessible review screens to confirm details instead of retyping.
- Ensure error correction preserves all other inputs.
Patterns to adopt vs replace
Use these patterns
- Thick, high-contrast focus outlines that survive brand colours.
- Buttons and links with 24 × 24 hit areas on touch layouts.
- Sortable lists with Up/Down controls and live announcements.
- Sign‑in flows that allow paste and support password managers.
- Form steps that pre‑populate known values.
Replace these anti‑patterns
- Thin, low-contrast focus rings that vanish on images.
- Tiny close icons with no extra hit area.
- Drag-only carousels or sliders.
- CAPTCHAs that require image/text puzzles without alternatives.
- Multi‑step forms that repeatedly ask for the same details.
Quick testing flow for teams
- Keyboard first: Tab through key journeys (sign‑in, search, checkout, contact) and capture any obscured or lost focus.
- Pointer targets: Test on a real phone; tap the smallest controls and confirm errors are rare.
- Auth flow: Sign in with and without a password manager; try pasting credentials.
- Forms: Trigger an error on step 2 and ensure step 1 values persist.
- Assistive tech spot check: Use a screen reader to confirm focus order and announcements on interactive updates.
Ways to implement this in your roadmap
Component audit & fixes
Journey-led accessibility
Clinic & coaching
Final guidance
Treat WCAG 2.2 as a design quality upgrade: clearer focus, easier taps, simpler sign‑in, and less retyping. Fix components first, then validate key journeys on real devices. If you need help prioritising for your stack and timelines, book a free consultation to get personalised advice on the right IT course or career path for your goals.
Turn what you just learned into a real IT career move
Whether you want to build job-ready skills, follow a structured career path, or get expert advice before choosing a course, Codionix IT Training UK can help you move forward with confidence.
Explore IT Courses
Browse instructor-led training across cloud, cybersecurity, networking, data, support, digital skills, and more.
View CoursesView Career Paths
See structured pathways designed to help you progress toward roles like helpdesk technician, network engineer, ethical hacker, and beyond.
Explore Career PathsBook Free Consultation
Not sure which course or path fits you best? Speak with the team and get clear, practical guidance before you commit.
Get Free AdviceRelated articles
Evening UI/UX Courses UK: How to Choose a Live Online Class
Learn how to choose a live online UI/UX course in the UK that fits your schedule. Use a practical decision checklist to assess class format, size, practice time, and access to one-to-one consultation.
UK ecommerce checkout UX: a 4-week optimisation checklist
Time-boxed, classroom-tested checklist for UK ecommerce checkout UX ahead of peak season. Learn prioritised experiments, inclusive design tips, and where to join Codionix short live workshops.
UX Certification UK comparison 2026: BCS, NN/g, UXQB, Google
A practical, side-by-side guide to the UK’s leading UX certifications (BCS, NN/g, UXQB, Google). It covers recognition, study effort, cost, and how live classes or coaching fit each route.
Free IT Training Consultation
Use the calendar to book your free one-to-one course advice session with a Codionix IT training expert. Get personalized career guidance to help you choose the best online IT course in the UK for your goals. We’re happy to answer any questions you may have and help you determine which of our training programs best fit your needs.
How it works?
You schedule a call at your convenience
We do a free discovery and consulting meeting
We guide you towards the best career path for you
Your benefits:
- Personal Guidance
- Course Clarity
- Career Focus
- Honest Advice
- Stress-Free
- Clear Direction
Find us on:
Schedule a Free Consultation
Not sure which IT course is right for you? Book a free consultation and get expert guidance from our team — no cost, no pressure.
