Digital A11y Testing

This guide provides essential information and clear steps to help you start testing for digital accessibility. You'll learn what accessibility testing involves and how to perform it.

What is Digital Accessibility Testing?

Digital accessibility testing is the process of evaluating digital content—websites, software, documents—to ensure everyone, including people with disabilities, can use it. This testing ensures inclusive and accessible digital experiences.

There are two primary types of accessibility tests:

  1. Technical Tests: These tests evaluate a digital property against established accessibility standards, such as the Web Content Accessibility Guidelines (WCAG). Technical testers and developers perform these tests using specialized tools.
  2. Functional Tests: These tests assess how a digital property performs for users with disabilities. Users with disabilities often conduct these tests, using their assistive technologies to verify usability and compatibility.

Why Use a Blended Testing Approach?

A blended strategy, combining both technical and functional tests, is crucial for effective accessibility testing.

  • Technical tests verify that foundational code meets accessibility standards.
  • Functional tests confirm that the actual user experience is accessible and usable for people with disabilities.

Employ both methods to achieve a comprehensive understanding of a digital property's accessibility.

Understanding Technical vs. Functional Requirements

To create fully accessible digital products, you must meet both technical and functional requirements.

  • Technical Requirements: These focus on the underlying implementation. Test requirements are split between those that can be tested automatically and those requiring manual checks. The goal is a conformant technical implementation.
    • Tools for Technical Tests: Use automated web page checkers, web browser developer toolbars (e.g., AMP Toolbar for Firefox), color contrast checkers, accessibility API inspection tools (e.g., Inspect), and your keyboard.

  • Functional Requirements: These ensure a system is available to and usable by people with disabilities. Verify that accessibility techniques are supported.
    • Tools for Functional Tests: Utilize screen readers, screen magnifiers, speech recognition software, and operating system accessibility features (e.g., High Contrast, Large Text).

How to Check Your Content for Accessibility

You must check your content for accessibility using both automated tools and manual, non-technical tests prior to use and publication. Consider tracking your findings in a report to streamline remediation efforts.

Automated Tools for Testing

Automated tools evaluate a website’s code and content, identify accessibility issues, and provide guidance for fixes. These tools save time and catch errors that may not be immediately obvious.

  • Rice-Licensed Tool: Level Access Use Level Access to break down accessibility issues into manageable tasks, track compliance progress, and receive recommendations.

  • Free Automated Tools: Numerous helpful accessibility tools are available. We recommend evaluating websites with the following:
    • Web Browser Developer Toolbars: Inspect code, check color contrast, and simulate different screen sizes using built-in browser tools.
    • Color Contrast Checkers: Ensure sufficient contrast between text and background colors for readability.
      • Colour Contrast Analyser by The Paciello Group, a separate application that can select colors using an eyedropper tool.
      • Contrast Checker by WebAIM, includes lightness sliders to adjust the colors to ones with sufficient contrast.

Manual Testing Methods

Automated tools cannot catch every error, as they do not understand context or evaluate content quality. After an initial pass with automated tools, you must perform manual testing to ensure your website is inclusive and accessible.

Content Review

Read your content with accessibility best practices in mind. Focus on clear language, logical headings, and appropriate alternative text for images.

  • Readability: Review your content for clarity. Use plain language and spell out acronyms on their first use. Avoid jargon.
  • Headings: Check that page titles are unique, descriptive, and marked as <h1> (one per page). Ensure all visual headings are useful, descriptive, and in hierarchical order (<h2>, <h3>, etc.). Look for any skipped levels (e.g., <h2> directly to <h4>).
  • Link Text: Avoid generic link text like "read more" or "click here." Make link text descriptive.
  • Visual Checks (Zoom to 200%) Zoom in on your page (Ctrl + for PCs, Command + for Macs) and check:
    • Layout: Does all content remain visible and in a logical order? Does anything overlap or appear too far apart?
    • Navigation: Do menus switch to a mobile-style format? Can you easily navigate and close these menus?
    • Scrolling: Do you have to scroll horizontally to read everything? Is any content cut off?
    • Functionality: Do all links, buttons, forms, and menus still work correctly when zoomed in
  • Images
    • Alt Text: Ensure all non-decorative images have succinct, accurate, and useful alternative ("alt") text that describes their content and function.
    • Text in Images: Check for images that contain text. Confirm that this text is also present in the body content or in the alt text. Try to highlight the text with your cursor to test this.
  • Color
    • Contrast: Verify that the text and background color contrast ratio is at least 4.5:1.
    • Meaning: Do not use color as the only way to convey meaning or information.

  • Forms

    • Labels: Confirm that all form controls have descriptive labels. If a label isn't visible, check for a hidden <label>, aria-label, or title attribute.

  • Tables

    • Purpose: Ensure tables are used only for tabular data, not for page layout.
    • Structure: For data tables, confirm they have a table caption and clear row and/or column headers.

Keyboard Testing

Verify that all interactive elements (links, buttons, forms, navigation menus) operate solely with a keyboard (Tab, Shift+Tab, Enter, Spacebar, arrow keys). This is critical for users who cannot use a mouse.

Screen Reader Review

Test with a screen reader to uncover issues related to reading order, heading structure, and how interactive elements are announced. This provides insight into the experience of users with visual impairments. The three main screen readers that are used by assistive technology users are: JAWS (paid license required), NVDA (free), VoiceOver (Mac OS). It is valuable to test using a variety of screen readers, as each one works differently with content.

Mobile Testing

Mobile accessibility testing is an essential step. Many people access digital content on smartphones and tablets. TalkBack (Android) and VoiceOver (iPhone) are built-in screen readers that read page content aloud. Use the following guidance for comprehensive mobile accessibility testing:

  • Test Android TalkBack: Learn how to use the TalkBack screen reader on Android devices to understand content navigation and presentation.
  • Test with iPhone (VoiceOver): Practice using VoiceOver on iPhones to experience how users with visual impairments interact with and hear content.

More Resources