Changes to the Design System to meet WCAG 2.2
W3C owns and manages the Web Content Accessibility Guidelines (WCAG) 2.2.
In 2023, the Design System team assessed and updated the GOV.UK Design System to comply with the new criteria and recommendations given in WCAG 2.2.
We included code changes in GOV.UK Frontend v5.0.0 to make it easier for services to make changes to comply with WCAG 2.2. We also added guidance to make teams aware of the changes and help them make necessary adjustments to their services.
Make sure your service meets the new WCAG 2.2 criteria
WCAG 2.2 was published in October 2023. You’ll need to comply with the new criteria no later than October 2024. See more about Meeting government accessibility requirements in the GOV.UK Service Manual.
What you need to do
- Revisit the Government Digital Service (GDS) guidance on what accessibility is and why your service needs to invest in it
- Read What’s new in WCAG 2.2 to understand the new criteria your service will need to comply with
- Ask your wider organisation for support to prepare for work needed to meet WCAG 2.2
- Update your service to use GOV.UK Frontend v5.0.0 or later, to make it easier to make changes in your service
- Review the lists on this page of affected components and patterns in the Design System
- Assess your service to see how many affected components and patterns are in use
- Plan and implement the changes needed to your service
Make sure there’s expertise within your organisation by advocating for people to receive training in accessibility. To provide some help with this, the Design System team is organising community events to help service teams share information with each other.
Components and patterns affected in the Design System
We’ve made changes to these components and patterns to comply with WCAG 2.2 level AA. You must check if your service needs amending to align with these changes.
See an explanation of every success criteria in WCAG 2.2 on the W3C website.
Our Images page also includes guidance to help ensure icons and images in your service meet Target size (minimum).
| Component | Relevant WCAG 2.2 criteria |
|---|---|
| Back link component | Redundant entry Target size (minimum) |
| Breadcrumbs component | Target size (minimum) |
| Button component | Target size (minimum) |
| Cookie banner component | Focus not obscured (minimum) Target size (minimum) |
| Error message component | Redundant entry |
| File upload component | Dragging movements Redundant entry |
| GOV.UK footer component | Consistent help |
| GOV.UK header component | Focus not obscured (Minimum) Consistent help |
| Phase banner component | Focus not obscured (minimum) |
| Select component | Dragging movements |
| Service navigation component | Focus not obscured (Minimum) Consistent help |
| Summary list component | Redundant entry Target size (minimum) |
| Tag component | Dragging movements |
| Ask users for… | Relevant WCAG 2.2 criteria |
|---|---|
| Addresses pattern | Redundant entry |
| Bank details pattern | Redundant entry |
| Email addresses pattern | Redundant entry |
| Equality information pattern | Redundant entry |
| Names pattern | Redundant entry |
| National Insurance Numbers pattern | Redundant entry |
| Passwords pattern | Accessible authentication Consistent help Target size (minimum) |
| Payment card details pattern | Target size (minimum) |
| Help users to… | Relevant WCAG 2.2 criteria |
|---|---|
| Check a service is suitable pattern | Redundant entry |
| Check answers pattern | Redundant entry |
| Complete multiple tasks pattern | Dragging movements Redundant entry |
| Confirm a phone number pattern | Consistent help |
| Confirm an email address pattern | Accessible authentication |
| Contact a department or service team pattern | Consistent help |
| Create accounts pattern | Accessible authentication Redundant entry |
| Navigate a service pattern | Focus not obscured (Minimum) Consistent help |
| Recover from validation errors pattern | Redundant entry |
| Page | Relevant WCAG 2.2 criteria |
|---|---|
| Page not found pages pattern | Consistent help |
| Question pages pattern | Dragging movements Redundant entry |
| Service unavailable pages pattern | Consistent help |
| There is a problem with the service pages pattern | Consistent help Redundant entry |
Need help?
If you’ve got a question about the GOV.UK Design System, contact the team.