WAVE Tool Showing Errors on Your Site

Why it matters

WAVE (Web Accessibility Evaluation Tool), developed by WebAIM, is one of the most widely used accessibility testing tools in the industry. When WAVE shows errors on your site, it means automated detection has found definite WCAG violations — not just potential issues. Each red error represents a failure that blocks real users with disabilities from accessing content. WAVE errors are also frequently used as evidence in ADA demand letters and lawsuits: attorneys run WAVE on target sites and attach the error report to demonstrate violations. A site with 50+ WAVE errors is a clear target for serial ADA plaintiffs. More importantly, these errors represent real barriers: a blind user who cannot identify a form field cannot complete your checkout; a deaf user who cannot find the transcript link cannot consume your video content.

Symptoms — what you'll see

If your site has this problem, you may observe any of the following:

• WAVE browser extension shows red "Errors" count on the page badge
• Yellow/orange "Alerts" indicating potential issues that need review
• Red icons overlaid on the page pointing to specific problematic elements
• WAVE sidebar shows categories: Errors, Alerts, Features, Structural, ARIA, Contrast
• High error counts on forms, images, navigation, and dynamic content areas
• Contrast errors highlighted across multiple text elements

Common causes

• Images uploaded via CMS without alt text (common in WordPress and Shopify)
• Icon-only buttons and links without accessible names
• Form inputs added quickly during development without labels
• Color palettes chosen for aesthetics without contrast checking
• Template-based sites where the base template has accessibility issues that multiply across pages
• Third-party widgets and embeds that introduce their own violations
• PDF links and documents that are not screen-reader accessible

How to fix it

1. 1Install the WAVE browser extension (Chrome/Firefox) or use wave.webaim.org for public pages.
2. 2Fix Errors first (red icons) — these are definite WCAG violations: missing alt text, empty links, missing form labels, empty buttons.
3. 3Empty links ("linked image missing alternative text"): add descriptive alt text to the linked image or aria-label to the <a> element.
4. 4Missing form labels: add <label for="..."> elements or aria-label attributes to all inputs.
5. 5Missing alt text: add appropriate alt attributes to all <img> elements.
6. 6Empty buttons: add descriptive text or aria-label to buttons that contain only icons.
7. 7Address Contrast errors: use the WAVE contrast panel to see exact failing ratios and update colors.
8. 8Review Alerts (yellow) for structural and best-practice issues: redundant links, suspicious alt text, long alt text, justified text.
9. 9Do not over-fix WAVE Alerts — some are informational and may be intentional. Validate each in context.

<!-- WAVE Error: Empty link -->
<a href="/home"><img src="logo.png"></a>

<!-- WAVE Error: Empty button -->
<button><svg><!-- icon only --></svg></button>

<!-- WAVE Error: Missing form label -->
<input type="text" name="search" placeholder="Search...">

<!-- FIXED: linked image with alt text -->
<a href="/home"><img src="logo.png" alt="Acme Co - return to homepage"></a>

<!-- FIXED: icon button with aria-label -->
<button aria-label="Search"><svg aria-hidden="true"><!-- icon --></svg></button>

<!-- FIXED: visible label + placeholder for hint -->
<label for="site-search">Search</label>
<input type="text" id="site-search" name="search" placeholder="Search products...">

How to test your fix

After applying the fix, verify it works using these testing steps:

1. Install the WAVE Chrome or Firefox extension from wave.webaim.org.
2. Visit each key page type: home, product/service, about, contact/form, blog, checkout.
3. Click the WAVE icon and review the summary: aim for 0 Errors on all pages.
4. Click each error icon on the page to see the HTML and learn the specific violation.
5. Use the "Details" panel in the WAVE sidebar for a full list with descriptions.
6. Export results: WAVE Pro (paid) allows CSV export for audit tracking.
7. Re-run after fixes to confirm errors are resolved.

Frequently asked questions