Lighthouse Accessibility Audit Guide

Master web accessibility with Lighthouse. Learn how accessibility audits work, why they matter for users and SEO, and how to fix common issues.
Harlan WiltonHarlan Wilton9 min read Published

Web accessibility determines whether people with disabilities can use your site. This includes users who are blind, deaf, have motor impairments, cognitive disabilities, or temporary limitations like a broken arm.

Lighthouse tests accessibility using axe-core, the industry-standard accessibility testing engine. Each audit is binary: pass or fail. Unlike performance metrics with thresholds, accessibility either works for users or it does not.

The overall accessibility score represents the percentage of passed audits. A score of 85 means 85% of applicable audits passed.

Why Accessibility Matters

Real Users Depend On It

Over 1 billion people worldwide live with disabilities. In the US alone, 26% of adults have some type of disability. These are not edge cases. They are a significant portion of your potential audience.

Consider how users interact with your site:

  • Screen reader users navigate by headings, links, and landmarks. If your heading hierarchy skips from h1 to h4, they lose context. If links say "click here" without context, they have no idea where they lead.
  • Keyboard-only users tab through interactive elements. If a button cannot receive focus or a modal traps them, your site becomes unusable.
  • Low-vision users rely on sufficient color contrast. Light gray text on white backgrounds is invisible to them.
  • Motor-impaired users may use voice control or switches. Tiny touch targets and timed interactions create barriers.

Accessibility failures do not just inconvenience people. They completely lock them out.

Web accessibility is increasingly mandated by law:

RegionLawRequirement
United StatesADA, Section 508Public accommodations must be accessible
European UnionEuropean Accessibility ActDigital services must meet WCAG 2.1 AA by 2025
United KingdomEquality Act 2010Service providers must make reasonable adjustments
CanadaAODAOntarian organizations must meet WCAG 2.0 AA
AustraliaDDADiscrimination includes inaccessible websites

Web accessibility lawsuits reached over 4,000 in 2024. Plaintiffs typically target violations detectable by automated tools. The same issues Lighthouse flags.

SEO Overlap

Many accessibility improvements benefit SEO:

  • Alt text on images helps search engines understand content
  • Semantic HTML (<nav>, <main>, <article>) clarifies page structure
  • Descriptive link text provides context to crawlers
  • Document titles appear in search results
  • Heading hierarchy organizes content logically

Google does not directly use accessibility as a ranking factor. But the underlying practices improve crawlability and content quality.

How Lighthouse Scores Accessibility

Lighthouse runs axe-core against your page and evaluates dozens of rules. Each applicable rule either passes or fails. The score formula:

Score = (Passed Audits / Total Applicable Audits) * 100

Important points:

  • Binary results: Each audit is pass/fail. There is no "partial credit"
  • Weighted scoring: Some audits carry more weight based on user impact
  • Not applicable: If an audit does not apply (no images on page = no image-alt check), it does not affect your score
  • Automated limitations: Lighthouse catches about 30-50% of accessibility issues. Manual testing remains essential

A perfect 100 does not mean your site is fully accessible. It means you passed all automated checks. Screen reader testing, keyboard navigation testing, and usability testing with disabled users reveal issues automation misses.

Common Accessibility Issues

These are the most frequently failing audits across websites:

Names and Labels

ARIA Issues

IssueImpactFix Complexity
Invalid ARIA rolesHighMedium
Missing required ARIA attributesHighMedium
Invalid ARIA attribute valuesHighMedium
ARIA hidden on bodyCriticalLow
Duplicate ARIA IDsHighMedium

Color and Contrast

IssueImpactFix Complexity
Insufficient color contrastHighMedium
Links not distinguishable from textMediumLow

Document Structure

IssueImpactFix Complexity
Missing document titleHighLow
Missing html lang attributeHighLow
Invalid lang attributeMediumLow
Skipped heading levelsMediumLow
Empty headingsMediumLow
IssueImpactFix Complexity
No skip link or landmarkMediumLow
Tabindex greater than 0MediumLow
Duplicate access keysLowLow

Tables

IssueImpactFix Complexity
Table cells missing headersHighMedium
Invalid th scopeMediumMedium

Diagnose your specific issue

How to Test Accessibility

Lighthouse (Automated)

Run Lighthouse in Chrome DevTools:

  1. Open DevTools (F12)
  2. Go to Lighthouse tab
  3. Check Accessibility category
  4. Click Analyze page load

Review the failing audits. Each includes the failing elements and a link to documentation.

Chrome DevTools Accessibility Panel

For deeper inspection:

  1. Open DevTools → Elements tab
  2. Select an element
  3. View Accessibility pane in sidebar
  4. Check computed accessible name, role, and properties

The accessibility tree shows how assistive technologies interpret your page. If an element is missing from this tree, screen readers cannot find it.

axe DevTools Extension

Install axe DevTools for more detailed testing than Lighthouse alone. It provides:

  • Intelligent guided tests for complex issues
  • Best practice violations beyond WCAG
  • Issue grouping by component

Screen Reader Testing

Automated tools catch syntax issues. Screen reader testing reveals usability issues.

Screen ReaderPlatformCost
NVDAWindowsFree
JAWSWindowsLicensed
VoiceOvermacOS/iOSBuilt-in
TalkBackAndroidBuilt-in

Basic screen reader test:

  1. Close your eyes or turn off the monitor
  2. Navigate using only keyboard
  3. Can you understand the page structure?
  4. Can you complete key tasks?

Keyboard Testing

Tab through your page:

  • Can you reach all interactive elements?
  • Is focus visible at all times?
  • Can you operate all controls (buttons, menus, forms)?
  • Can you escape from modals?
  • Is tab order logical?

If any answer is no, users with motor impairments cannot use that feature.

Framework Considerations

Modern JavaScript frameworks require extra attention for accessibility:

Client-side routing: When navigation happens without page reload, screen readers may not announce the new content. Manage focus on route change.

Dynamic content: Content added via JavaScript needs appropriate ARIA live regions to announce changes.

Component libraries: Third-party UI libraries vary in accessibility quality. Audit them before adoption.

Virtual DOM: Framework abstractions can obscure accessibility issues. The rendered HTML is what matters.

Test Your Entire Site

Checking accessibility page-by-page misses patterns. Your marketing pages might pass while app screens fail. Product pages might be accessible while the checkout flow is not.

Different templates have different issues. An author creating content might leave out alt text. A developer building components might forget ARIA labels.

Unlighthouse scans your entire site and surfaces accessibility scores for every page. You will see which templates have issues, which pages are outliers, and whether fixes actually work at scale.

The CLI is free and runs locally. Cloud adds scheduled monitoring to catch regressions before users report them.