How to Test Web Accessibility in Chrome: WAVE, axe and Lighthouse

Which Accessibility Checker Should You Use in Chrome: WAVE, axe, or Lighthouse?

Start with the WAVE extension if you want a fast visual overview of accessibility issues on any page. It overlays icons directly on the page rather than opening a separate report. Add axe DevTools if you need issue details tied to specific WCAG success criteria, and use Chrome's built-in Lighthouse audit when you want a score alongside performance and SEO checks in the same run.

None of the three replaces manual testing with a keyboard or a screen reader, but together they catch most of what shows up in an automated accessibility scan before a human ever looks closely at the page. Browse more options in Find Extensions' accessibility category if you're building out a wider testing toolkit.

How to Install and Run the WAVE Extension in Chrome

WAVE installs like any other Chrome extension and evaluates web accessibility within your browser. Like most page-analysis tools, it needs permission to read the content of the page you're checking; see Find Extensions' permissions guide if that request gives you pause.

1. Go to the WAVE Evaluation Tool listing in the Chrome Web Store.
2. Click Add to Chrome, then Add extension to confirm.
3. Pin it by clicking the puzzle-piece Extensions icon and clicking the pin next to WAVE.
4. Open the page you want to check, then click the WAVE icon in your toolbar.
5. Wait a moment while WAVE injects its report icons directly onto the page.

The icons appear inline, right where the issue is, a red icon over a form field with no label, for example, instead of sending you to a separate tab to cross-reference line numbers. That inline placement is the main reason people reach for WAVE first.

How to Read a WAVE Report: Errors, Alerts, Features, and Contrast

WAVE groups what it finds into a small set of categories, shown in a summary panel plus icons scattered across the page itself. Read the summary panel first, then click through individual icons to see exactly which element triggered each one.

Errors

Issues WAVE is confident will cause real problems for assistive technology, like missing alt text or an empty link.

Alerts

Likely problems that need a human judgment call, such as a heading level that skips a number.

Features

Accessibility features already present on the page, like a properly labeled form or a skip-navigation link.

Structure

An outline of headings, lists, and landmarks so you can spot a page that jumps from an H1 straight to an H4.

Contrast

A separate check for text and background colors that fall below common contrast guidelines.

Click any icon on the page itself, not just in the sidebar, to see WAVE's explanation and, in many cases, a suggestion for what a fix should look like. This is faster than reading a static report top to bottom.

How to Run axe DevTools Alongside WAVE

axe DevTools lives inside Chrome's own DevTools panel rather than as a toolbar icon, which makes it a better fit once you're already in the browser's inspector debugging something else on the page.

1. Install axe DevTools from the Chrome Web Store the same way you installed WAVE.
2. Open Chrome DevTools with Cmd+Option+I on Mac or Ctrl+Shift+I on Windows and ChromeOS.
3. Click the axe DevTools tab in the DevTools panel bar; you may need the » overflow menu to find it.
4. Click Scan ALL of my page to run the check.
5. Work through the results list; each issue links to the specific element highlighted in the Elements panel.

Because axe results appear inside DevTools, they're easier to correlate with the HTML you're editing than WAVE's page overlay, useful once you move from spotting a problem to actually fixing the markup that caused it.

Using Chrome's Built-in Lighthouse Accessibility Audit (No Extension Needed)

Lighthouse ships inside every copy of Chrome's DevTools, so there's nothing to install if you just want a scored accessibility check alongside performance and SEO for the same page.

1. Open the page, then open DevTools with Cmd+Option+I or Ctrl+Shift+I.
2. Click the Lighthouse tab; older Chrome versions may label it differently.
3. Under Categories, keep Accessibility checked and uncheck the others if you only want that score.
4. Choose a Device mode, mobile or desktop, to match how most visitors reach the page.
5. Click Analyze page load and wait for the report to generate.

Lighthouse's accessibility section is powered by the same open-source axe-core rule engine that drives standalone axe DevTools, so expect meaningful overlap between the two rather than two completely different issue lists.

WAVE vs axe vs Lighthouse: What Each One Actually Catches

All three tools are automated, which means they can only catch problems a script can detect: missing attributes, contrast math, and structural patterns. None of them can tell you whether an interaction actually makes sense to a screen reader user.

Because Lighthouse produces a single score, it's tempting to treat a high number as 'accessible.' Treat it as a floor, not a finish line. A page can score well on Lighthouse and still be unusable with a screen reader if the reading order doesn't match the visual layout.

Manual Checks None of These Tools Can Automate

Automated scanners miss anything that requires judgment about meaning or flow, which is most of the actual screen reader and keyboard experience on a real page.

• Tab through the whole page using only Tab and Shift+Tab and confirm the focus order matches the visual order.
• Check that every interactive element has a visible focus outline, not just a color change that's hard to notice.
• Turn on a screen reader, ChromeOS's built-in ChromeVox or a desktop screen reader, and listen to whether image alt text and link labels actually make sense out of context.
• Zoom the page to 200% and confirm nothing gets cut off or overlaps.
• Try the page with images disabled to see whether the layout still tells you what's going on.

This is also where a distraction-free reading mode or a font and contrast checker earns its place in the workflow, not as an accessibility auditor, but as a way to spot-check what a low-vision or easily distracted visitor is actually dealing with.

Fixing the Issues These Tools Flag Most Often: Contrast, Alt Text, Headings

Most first scans come back with the same handful of repeat offenders, and most of them are cheap to fix once you know where to look.

Low contrast text is usually a design-system problem, not a one-off. If WAVE or axe flags it on one page, check every page using that same gray-on-white body text or muted button color, since the fix belongs in the shared style, not the single page.

Missing alt text is often not actually missing; it's present but left empty on an image that isn't decorative, which automated tools read as a fail even though a developer technically added the attribute.

Heading structure problems usually come from choosing a heading tag for its font size rather than its outline position. Fix it by restyling the tag with CSS instead of skipping straight to whichever heading level looks right visually.

Extensions That Help You Spot-Check Accessibility Beyond the Scanners

These aren't accessibility scanners; they simulate part of the experience a scanner can only describe in text, which is useful once you've already fixed what WAVE, axe, and Lighthouse flagged.

Run all three scanners on a template before it ships, then keep one of these companion extensions installed for the spot checks a scan alone won't catch. See how Find Extensions vets picks like these in our methodology, and browse more Chrome testing guides on the Find Extensions blog.