# Use Firefox for accessibility testing

DevFeed: [Use Firefox for accessibility testing](<https://devfeed.tech/articles/use-firefox-for-accessibility-testing-9422.md>)

Original publisher: [Read original article](<https://a11yproject.com/posts/using-firefox-for-accessibility-testing/>)

Author: Todd Libby

Published: 2022-07-17T00:00:00Z

Content type: article

Language: en

Sources: [The A11Y Project](<https://devfeed.tech/sources/the-a11y-project.md>)

Topics: [Accessibility](<https://devfeed.tech/topics/accessibility.md>), [Firefox](<https://devfeed.tech/topics/firefox.md>), [dev-tools](<https://devfeed.tech/topics/dev-tools.md>), [browsers](<https://devfeed.tech/topics/browsers.md>), [Web](<https://devfeed.tech/topics/web.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [accessibility-tools](<https://devfeed.tech/tags/accessibility-tools.md>), [audits](<https://devfeed.tech/tags/audits.md>), [browsers](<https://devfeed.tech/tags/browsers.md>), [dev-tools](<https://devfeed.tech/tags/dev-tools.md>), [developer](<https://devfeed.tech/tags/developer.md>), [firefox](<https://devfeed.tech/tags/firefox.md>), [testing](<https://devfeed.tech/tags/testing.md>), [web](<https://devfeed.tech/tags/web.md>)

## AI overview

This article explains how to use Firefox's built-in accessibility tools for web accessibility testing. It covers the Accessibility tab, accessibility-tree inspection, color-contrast, keyboard and form-label checks, visual simulations for different color-vision conditions, tabbing-order visualization, and Checks and Properties panels.

## Source excerpt

Firefox has become one of the best tools for accessibility audits. Let's go over Firefox's accessibility features that you can use today. Built-in accessibility tools In this article I'll discuss The Accessibility Tab, where we will begin and then move through to each component of the Accessibility Tab. First, the Check for issues tab, the Simulate menu, and end with the Show Tabbing Order checkbox. I'll finish with the Checks and Properties panel. The Accessibility tab Whenever you right-click on an element in a page, you can select Inspect Accessibility Properties to directly view that element in Firefox's accessibility tools. Similarly, if you're using the Inspector pane in Firefox's dev tools, you can right-click on any node and choose Show Accessibility Tools to view that node in Firefox's accessibility tools. Firefox's built-in accessibility tool is probably one of the best features in browsers' dev tools out there now. It shows you the current web page's accessibility tree, and it has panels for color-contrast checks and the current node's accessibility-tree properties. You can traverse the accessibility tree, and as you hover over each node, Firefox will show a tooltip over that node in the viewport with the name of the node and some basic properties. And the Checks and Properties panels can show you all the pertinent information for that node like its color and contrast ratio, name, role, and value. The Check for issues menu If you enable this handy feature, Firefox can check for color-contrast issues,it can do its best to try to find keyboard issues, and it can try to find form-label issues. There's also an All Issues option that will run all of those checks for the page. Each issue will show you the role and name of the element that has an issue, and the Checks and Properties panels will provide some information and values to help you resolve the issues. The Simulate menu This is a great tool for simulating visual differences. This can simulate: Protanopi