35 OER Accessibility Tools
UTSA-Endorsed Accessibility Checkers
The UTSA Accessibility Team and the UTSA Libraries’ OER Team recommend using ANDI or WAVE to check the accessibility of existing OER. Both of our teams are trained on these tools, use them regularly to check OER accessibility on UTSA Pressbooks, and can answer questions about how work.
WAVE
WAVE was created in 2001 and revamped in 2019 by the WebAIM, a non-profit organization based at the Center for Persons with Disabilities at Utah State University.
The WAVE browser plug-in is easy to use and helps you see issues on your pages, such as contrast errors or structural issues. The tool also provides information and links to further information regarding WCAG so it helps you learn about accessibility as you use it. Follow the links below to add the WAVE plug-in to your preferred browser.
ANDI
ANDI (Accessible Name and Description Inspector) is a free accessibility testing tool that provide automated detection of accessibility issues, reveals what a screen reader should say for interactive elements (the accessible name computation), and gives practical suggestions to improve accessibility and check 508 compliance. The great news is you can also use ANDI by installing it as a plugin on your preferred choice of browser. ANDI can be installed on Chrome, Edge, Firefox, Internet Explorer, and Safari.
Other Accessibility Tools: Use at Your Discretion
The tools below may also be helpful as you evaluate OER that you are adopting for accessibility. Please note that these tools are not endorsed and are not used by the UTSA Digital Accessibility Team and the UTSA OER Team.
aXe: the Accessibility Engine
Created by the Deque Systems, the aXe browser extension will run a quick in-browser test. The extension returns detailed information on accessibility violations and how to fix them with a link to more in-depth information. You use the aXe extension in conjunction with opening and viewing “Inspect Element” or “Inspect” in your browser. Follow the links below to add the aXe plug-in to your preferred browser.
AChecker
An open source Web accessibility evaluation tool. It can be used to review the accessibility of Web pages based on a variety international accessibility guidelines.
The AChecker provides the ability to generate downloadable reports: You can export the reports in PDF, CSV, HTML, or EARL files. The reports list accessibility issues in the following categories:
- Known problems: These are problems that have been identified with certainty as accessibility barriers. You must modify your page to fix these problems;
- Likely problems: These are problems that have been identified as probable barriers, but require a human to make a decision. You will likely need to modify your page to fix these problems;
- Potential problems: These are problems that AChecker cannot identify, that require a human decision. You may have to modify your page for these problems, but in many cases, you will just need to confirm that the problem described is not present.
(Note: You DO NOT need to create an account to use AChecker, but you can save reviews and customize standards testing)
tota11y
The Tota11y: Accessibility visualization toolkit will help you visualize how your site performs with assistive technologies by allowing you to look at issues such as Headings, Color contrast, Link text, labels or Image alt tags. Tota11y is available as a browser plug-in and bookmarklet. Created by Khan Academy.
Follow the links below to add the tota11y plug-in to your preferred browser.
Web Developer
This web developer extension adds a toolbar button with various web developer tools to the browser. These tools can be used to check accessibility. Web Developer for Chrome, Web Developer for Firefox and Word Developer for Opera, and will run on any platform that these browsers support including Windows, macOS and Linux.
headingsMap
The extension by Jorge Rumoroso generates a document map or index of any web document structured with headings (you can access directly to the content by clicking on any of its items), and now, it shows the HTML 5 outline. The extension:
- Shows the structure of the main document headers.
- Indicates the level of each of the headers.
- Alert the cases where no headers in the document and those breaks incorrect header, keeping alert header to find a suitable level.
- Displays all the headers present in the document, including hidden by CSS techniques or those lacking content.
Follow the links below to add the headingsMap plug-in to your preferred browser.
Landmarks Navigation via Keyboard
The Landmark browser add-on allows you to navigate a web page via WAI-ARIA landmarks, using the keyboard or a pop-up menu. Landmark regions broadly signpost the areas of a page (e.g. navigation, search, main content and so on).
Follow the links below to add the Landmark plug-in to your preferred browser.
JAVAScript Bookmarklets
These 16 bookmarklets were created by Paul Adam, a Web & Mobile Accessibility Consultant in Austin, TX. The “Image”, “Force Focus” and “Headings” bookmarklets are really useful.
Accessibility Bookmarklets
These 5 bookmarklets were originally created by Pixo and Disability Resources and Educational Services (DRES) at the University of Illinois at Urbana-Champaign. They are based on WCAG 2.0, ARIA 1.0, and HTML5 requirements. and designed for use on modern desktop browsers (Chrome, Firefox, Safari, Opera, and IE 9 or above). Click on the bookmarklet images below to be taken to the instillation page. Once on the page, to install a bookmarklet, the most common way is to drag and drop a bookmarklet link into your browser’s bookmarks or favorites bar.
- Landmarks: Highlights all ARIA landmarks, including HTML5 tags that are interpreted as landmarks.
- Headings: Highlights all H1 through H6 elements on a page.
- Lists: Highlights every ordered list, unordered list, and definition list on a given page, along with how many list items exist for each list.
- Forms: Highlights form-related elements and provides info on their associated labeling techniques, grouping labels and ARIA roles.
- Images: Highlights the types of images on a page, along with their alt text.
A11Y Color Blindness Empathy Test
Empathy test for color blindness and visual impairment. This add-on emulates 8 types of color blindness, plus grayscale to check the contrast of your website.
Follow the links below to add the A11y plug-in to your preferred browser.
WCAG Contrast Checker
Color Contrast Analyzer
Attribution
