Accessibility tools and resources - Basic accessibility checks

To be able to say your service is fully compliant, you will need to check everything. There is no getting around it.

WCAG covers a lot of criteria and a lot of scenarios. Because it is a full standard, it has to cover every eventuality.

However, when testing we find most WCAG failures fall under the same 15 to 20 criteria. So, we’ve made a checklist of our top 10 things to test. We think this should cover a lot of the serious accessibility barriers people face and should tell you quite quickly how accessible your website or digital service is.

To make this checklist, we combined the common failures found by 8 different accessibility auditors along with the findings from the  Accessibility monitoring of public sector websites and mobile apps 2020-2021 corporate report.

We grouped the tests into a logical order based on how easy the tests are to execute, and how much effort they will take to fix.

Warning: The intent of this basic checklist is to cover the most common WCAG failures. Completing this checklist will not guarantee your service is fully compliant with WCAG

1. Automated tools

WCAG criteria:

Checklist:

  • HTML is valid
  • ARC Toolkit used
  • Axe Devtools used
  • Wave used

2. Responsive design

WCAG criteria:

Checklist:

  • All information available in portrait and landscape
  • Font size scales without breaking the layout when zooming
  • No horizontal scrolling on banned elements at 320px
  • Font size will scale up to “very large” and still be clear

3. Keyboard accessibility

WCAG criteria:

Checklist:

  • All interactions work using a keyboard
  • Focus is never trapped
  • Page has is a working skip link
  • Focus order is logical
  • Focus is always visible
  • Focus is contained within modals and pop-ups
  • Focus does not submit forms or activate links

4. headings and labels

WCAG criteria:

Checklist:

  • No heading levels have been skipped
  • Tables are captioned, headed and marked up correctly
  • Page has a H1, but not more than one
  • Headings and labels are clear and descriptive
  • All form fields have a label

5. Page title

WCAG criteria:

Checklist:

  • Page title describes the current page
  • Page title describes the current website or service

6. Links and buttons

WCAG criteria:

Checklist:

  • The purpose of each link and button is clear
  • No broken or internal-only links
  • Navigation menus on more than one page are in the same order
  • Buttons on more than one page are labelled consistently
  • Button icons have a text alternative
  • Buttons and links use the correct tags or roles

7. Colour contrast

WCAG criteria:

Checklist:

  • Colour alone is not used to convey information
  • Text larger than 18pt (24px) has a ratio of 3:1 or more
  • Text larger than 14pt (19px) and bold has a ratio of 3:1 or more
  • Text smaller than 18pt (24px) and not bold has a ratio of 4.5:1
  • Non-text elements have a contrast ratio of 3:1
  • Focus styles have a contrast ratio of 3:1

8. Images

WCAG criteria:

Checklist:

  • Alt text for important images is clear and accurate
  • Decorative images are hidden from screen readers
  • No images of text are being used

9. Announcements and alerts

WCAG criteria:

Checklist:

  • Any field which causes a validation error is easy to identify
  • Validation errors are explained so its easy to understand how to fix it
  • Validation errors are announced to screen readers
  • Expanded or collapsed sections are announced to screen readers
  • Notification messages are announced to screen readers
  • Pop-ups are announced to screen readers

10. Session timeouts

WCAG criteria:

Checklist:

  • There is a way to extend session timeouts without losing data