Testing an ICT Solution for Universal Design

The WCAG standard is mandatory for all public websites and serves as the basis for testing universal design on web pages. On this page, you will get an overview on how to get started with testing.

What Should Be Tested?

You should test a sufficiently large amount of content and functionality to determine whether the requirements are met or not. If your website has few pages, all pages should be tested. On a larger website, you can select pages that cover a wide range of functionality and content variations. We recommend testing:

  • All templates, components, and page types
  • All content types (e.g., images, videos, audio, tables, and graphs)
  • A selection of pages
  • Top tasks (from start to finish)
  • Most important and most used pages

How to Conduct Testing

Testing can be divided into two methods: manual and automated. Both should be conducted to uncover as many errors as possible, but manual testing will be easier for most people. Manual testing involves navigating the page using the tools at hand, such as a mouse, keyboard, and screen reader. Automated testing involves using a program to check the code on the website for errors.

Manual Testing

  • Start with easy manual checks for accessibility. Easy Checks (W3C).
  • Keyboard navigation: Check if you can access interactive elements when navigating the page using only the keyboard. Use the Tab key and Tab + Shift to navigate. This provides a good indication of any errors on the page.
  • Zooming and responsive design: Test if the page is responsive (content adjusts to the width of your browser window) and if you can zoom in on the content (Ctrl and +/- or Cmd and +/-) without losing content or functionality.

Testing with Assistive Tools

  • Screen readers such as VoiceOver (macOS and iOS), JAWS (Windows), NVDA (Windows), and TalkBack (Android).
  • Apple has many accessibility tools that can be used.

Testing with Users

  • Also test with users who use assistive tools.
  • Test navigation, form filling, and login processes, as these areas can be particularly challenging for people with cognitive impairments.

Automated Testing

Automated tests can get you a long way, but remember that tools may not find all errors. Tools also work slightly differently, so it's a good idea to use multiple tools to uncover as many errors as possible.

Tools for Automated Testing

  • Siteimprove browser plugin: Finds most accessibility issues and provides clear indications of where the errors are.
  • aXe browser plugin: Finds accessibility problems and provides links to helpful pages that explain the problem, its criticality, and which user groups are affected.
  • WAVE browser plugin: Finds accessibility problems and provides visualizations of issues and suggestions for solutions.
  • Lighthouse: Part of Accessibility Insights by Microsoft. Uses aXe to find accessibility problems.
  • ARC Toolkit: W3C's code validator.

Tools for testing text scaling and line spacing

  • Zoom Text Only: Chrome tool for testing text scaling.
  • Text Spacing Editor: Chrome tool for checking text spacing.

Tools for checking color contrast

  • Color Review: Web-based tool for finding colors with approved contrast ratios.
  • Colour Contrast Analyser: Desktop client for Mac and Windows, can simulate color blindness.
  • Color Oracle: Desktop client for simulating color blindness on Mac, Windows, and Linux.

Documenting the Testing

Document the findings you make. Describe the error as clearly as possible, preferably with screenshots, information about the browser used, and which tool detected the error. This makes it easier for the person fixing the error to reproduce it.

Resources

Universal design of content (UiO)

Accessibility Fundamentals Overview (W3C)

How to Meet WCAG (Quick Reference) (W3C)

WCAG Standard (W3C)

Published June 26, 2024 1:02 PM - Last modified July 1, 2024 12:54 PM