Accessibility testing

The front end has been tested for accessibility errors using a combination of the Siteimprove Accessibility Checker Chrome add on, and Mac Voiceover screen reader.

All pages in the Toolkit pass the Siteimprove accessibility checker at WCAG level AAA with 0 errors.

Some pages in the Toolkit present warnings in the Siteimprove accessibility checker WCAG level A – AAA, we are in the process of resolving these warnings.

The efforts we’ve made to improve accessibility during design and development:

  • We have limited the number of fonts used to one, and we have chosen a clean sans serif font without embellishments
  • No images are used to convey text or meaning
  • We use a dark grey for our body text colour to help prevent eye strain
  • All colour combinations where text is presented on top of a background colour have been tested to pass colour contrast guidelines level AAA
  • You can increase the text size in the browser up to 400% without breaking the page layouts or causing any text to spill off the screen
  • All links are underlined and have a clear hover and focus style
  • All links and interactive elements are keyboard focusable, interactive elements such as form fields, buttons and tabs use a clear focus style
  • All interactive elements including forms are keyboard navigable and use a logical tab order
  • Where icons convey semantic meaning a screen reader description has been provided.
  • Where icons convey no semantic meaning, an an aria attribute of “aria-hidden=‘true’” has been applied to prevent unwanted noise for users of screen reader technologies
  • Sections of the interface are laid out using HTML 5 semantic tags such as header, nav, footer. This conveys meaning when users of assistive technology are navigating the pages
  • We have avoided the over use of aria landmarks and roles to prevent unnecessary noise for users of assistive technology