Why Test?

It is important to test to determine the accessibility of websites and applications.

Most tests can be carried out using your browser and a keyboard. While many tests can be carried out by looking at the page's source code, you may find it easier for some tests to use the applications listed below.

We also encourage you to use a screen reader to evaluate your content. Please see our Screen Reader Resources for more information.

The following testing tools have been developed to help testers determine whether applications meet the Web Content Accessibility Guidelines (WCAG). These resources may be used on both Mac and Windows platforms.

The Web Developer Toolbar

The Web Developer Toolbar (WDT) is a plug in that works with both Firefox, Chrome and Opera and runs on any platform that these browsers support including Windows, macOS and Linux.

Figure: The Web Developer Toolbar with the ‘Information’ menu showing 

screenshot of web developer toolbar

The WDT is a set of menus and options that check the page for issues such as missing alt attributes for images, heading structure and form labels. It’s a useful alternative to looking in the source code itself.

YOUTUBE MEDIA
yOLqBlQwwXU

The Colour Contrast Analyser

The Colour Contrast Analyser (CCA) helps you determine the legibility of text and the contrast of visual elements, such as graphical controls and visual indicators. The CCA is available for Windows and Mac, and in multiple languages

Figure: Colour Contrast Analyser's main window (Mac version)

Colour Contrast Analyser's main window (Mac version)

Unlike the WDT the CCA can only test for one thing: color contrast and luminosity. To use it simply select the text and the colors will be automatically inputted. When the background colors are selected the contrast ratio is then shown together with an indication of if it passes WCAG.

Note: For Mac users who download the CCA and have trouble using the eyedropper tool, you may need to grant permission for the CCA to screen record. This setting is found in:
 
 
System Preferences > Security & Privacy > Privacy > Screen Recording
 

WebAIM Color Contrast Checker

WebAIM offers an online color contrast checker to determine if page elements meet web contrast accessibility standards. Visit the WebAIM Color Contrast Checker page to use.  

WAVE

WAVE is an additional tool to evaluate web accessibility. It displays accessibility information on a page by including icons and indicators helping to measure how accessible a page is. Test web content with WAVE by including a URL, uploading a file, or copying and pasting HTML code.

WAVE Browser Extension

WAVE has an extension available for Chrome and Firefox that allows you to evaluate web content for accessibility issues directly within Chrome and Firefox browsers. Because the extension runs entirely within your web browser, no information is sent to the WAVE server. This ensures 100% private and secure accessibility reporting. The extension can check intranet, password-protected, dynamically generated, or sensitive web pages. Also, because the WAVE extension evaluates the rendered version of your page, locally displayed styles and dynamically-generated content from scripts or AJAX can be evaluated.

JavaScript Bookmarklets for Accessibility Testing

Bookmarklets for Accessibility Testing use JavaScript to highlight roles, states, and properties of accessibility elements on the page.

Web Accessibility Favelets (WAF)

Favelets is a set of bookmarks with JavaScript test functions activated from your web browser.  

Accessibility Bookmarklet Project

Accessibility Bookmarklets are from the open source Accessibility Bookmarklet project and are links you can bookmark or favorite in your browser. The links contain Javascript that can run on any webpage to visualize information in the code. The bookmarklets only work with desktop/laptop browsers. Add the bookmarklets by dragging them into your bookmarks bar or by copying the link address and adding them manually to your bookmarks manager.

HeadingsMap

HeadingsMap is an browser extension for Chrome. The extension generates a documentmap/index of any web document structured with headings. 

HTML_CodeSniffer

HTML_CodeSniffer reviews HTML source code and and looks for problems in standard coding. HTML_CodeSniffer is written entirely in JavaScript, does not require any server-side processing and can be extended by developers to enforce custom coding standards by creating your own "sniffs".

aXE Chrome Extension

The aXE extension is an automated accessibility testing tool that alerts you to accessibility problems within a website. It is based on the aXe javascript library and is the third generation of accessibility rules for HTML-based user interfaces.

ARC Toolkit

The ARC Toolkit is a set of accessibility tools to aid developers in identifying accessibility problems and features. It is designed to be integrated into automated and manual accessibility tests and works alongside the auditor or developer in order to simplify repetitive tasks and interactively explore accessibility features and problems. The ARC Toolkit is tightly integrated with Chrome's Developer Tools.

NoCoffee Vision Simulator

The NoCoffee Vision Simulator extension helps identify common problems individuals with poor vision experience on web pages such as low acuity and low contrast sensitivity. Low acuity happens when pages have very small text or click targets. Low contrast sensitivity occurs when there is not enough contrast between page elements such as text and a page background. The NoCoffee Vision Simulator can help identify some of these issues.

Windows-specific applications

The following application/tool is specifically for the Windows platform.

Inspect.exe (part of the Windows Software Development Kit (SDK))

Inspect is a Windows-based tool that enables you select any UI element and view the element's accessibility data.