Skip to main content

Accessibility Deep Dive

Lighthouse reports one Accessibility score per page. That's useful, but it tells you nothing about what's broken or how bad it is. The accessibility dashboard at /sites/[siteId]/accessibility fixes that — every failing audit grouped by WCAG severity, with the exact pages that violate it.

Severity grouping​

Site Health maps every failing Lighthouse a11y audit onto WCAG severity. Fix top-down.

SeverityWhat it meansExamples
CriticalBlocks assistive tech users entirely.Missing form labels, buttons without accessible names, duplicate IDs on form fields.
SeriousMost users can work around it; some cannot.Low color contrast on body text, images missing alt, missing lang on <html>.
ModerateDegraded experience but usually navigable.Heading order skips, <li> outside <ul>/<ol>, ARIA misuse.
MinorBest-practice misses.Missing document title, missing meta viewport, minor landmark issues.

What you see on the page​

  • Trend chart — Accessibility score history across recent scans, so you can see if a publish made things worse.
  • Issue table — Every failing audit, grouped by severity, with count of affected pages.
  • Expandable rows — Click an issue to see the exact URLs that fail it, plus the Lighthouse description and fix guidance.

Common Webflow a11y issues​

These are the ones we flag on almost every site we scan. Most are 10-minute fixes in the Webflow Designer.

  • Missing form labels. Webflow's default form block ships inputs without visible labels. Add a label element or an aria-label.
  • Icon buttons with no accessible name. A Webflow button with only an icon inside reads as "button" to a screen reader. Add aria-label via custom attributes.
  • Low contrast on default themes. Many Webflow templates ship light gray body text on white (≈ 3:1). WCAG AA needs 4.5:1. Darken body text to #333 or better.
  • Link text that says "Click here" / "Read more". Link text should describe the destination.
  • Heading order skips. Don't jump <h1> → <h4>. Webflow makes this easy to miss when using type presets.
  • Images from CMS collections with no alt. Alt text is a per-item field — enforce it in the collection schema.
Not covered here: image optimization

This dashboard reports alt text and ARIA issues. If you're looking for oversized images (a performance issue, not a11y), see the CMS Image Audit.

Workflow​

  1. Run a scan.
  2. Open the accessibility dashboard.
  3. Fix every Critical issue first — these are lawsuit territory and trivially auto-detectable.
  4. Re-scan, confirm the count drops.
  5. Set a performance budget or alert rule on the Accessibility score to keep it from regressing.