Axe DevTools Extension Update: New Color Contrast Analyzer

The axe DevTools v4.28.0 release is one of the most impactful ones yet! After speaking with users, we quickly learned that the “needs review” color contrast issues are a major pain point for them. In fact, in a recent Deque study of 13,000+ pages, we found that color contrast issues accounted for 30.8% of the total number of issues found.

With this release, Pro users can now leverage the power of our machine learning algorithms to substantially reduce this problem. These new algorithms automatically determine if any “needs review” color contrast issues from an automatic scan are, in fact, issues or not.

What are “Needs Review” Color Contrast Issues?

There are certain instances where the automatic scan powered by axe-core can’t accurately determine the foreground and background colors of an element, such as when text runs across a gradient or an image. If you’re familiar with our axe-core mantra of “no false positives,” you’ll understand why it’s important these issues aren’t treated definitively until they are reviewed. We don’t want to waste time chasing false positives so we have previously classified these as “Needs Review,” indicating a manual review is required to confirm whether or not the issues are real.

This changes today. With axe DevTools v.4.28.0, users can definitively assess color contrast issues while still upholding our mantra, saving tons of time in manual reviews.

How the New Color Contrast Analyzer Works

The first time users with the Pro plan run a scan which has “needs review” color contrast issues (“Elements must have sufficient color contrast”), a dialog will appear which informs them of this new feature. They can then choose how this new feature will run:

• Choose when to run (Recommended): If reviewable color contrast issues arise, you can run it anytime after a scan.
• Run automatically after each scan: If reviewable color contrast issues arise, this tool will run automatically.

Choosing When the Tool Runs

We recommend the “Choose when to run” option. This will give users granular control over when the tool runs and won’t automatically increase the scan time. Any time there are “needs review” color contrast issues, the “We’ve found (x) color contrast issues for you to review. Click to automatically review them” button (within the main content of the page) will appear.

Running the Tool Automatically After Each Scan

Users can opt in to having the tool run automatically after each scan completes. This may significantly increase the time it takes to finish each scan. In this mode, the color contrast tool will kick off immediately after the automatic scan completes.

Results

Once the color contrast process is completed, users will be notified of how many issues were verified as true issues (no longer “needs review”), how many issues were deemed not issues, and how many remain as “needs review.” Those verified as issues will no longer be marked as “needs review” and instead will be displayed as real “automatic” issues. The issues which were deemed as non-issues will be removed as this indicates there is no color contrast issue to address. The rest of the issues will remain “needs review” and should be manually reviewed.

Configuration

The “needs review” color contrast analyzer tool can be configured in Advanced Settings under the “Color contrast review settings” heading.

This setting can also be configured organization-wide via extension policy with the “AutomaticColorContrastReview” property name. This property can be set to “automatic” which is equivalent to “Run automatically after each scan” or “manual” which is equivalent to “Choose when to run (Recommended).”

Conclusion

With the new color contrast “needs review” analyzer, the axe DevTools extension will do the heavy lifting and automatically review those issues. We’re always learning about our users’ needs and strive to address them. In this release, we shipped two major features surrounding “needs review.” We hope these features will save you time and increase your accessibility testing coverage!

If you’re not currently using axe DevTools Pro, you can sign up for a free trial (no payment needed).

Join us on Tuesday, May 24th in a free 30-minute webinar on the New Color Contrast Analyzer. Save your seat and register for the webinar.