DEV Community

DevToolsmith
DevToolsmith

Posted on

EAA Compliance Checklist: 10 Things Every EU Website Must Fix in 2026

#a11y #webdev #eaa #compliance

EAA Compliance Checklist: 10 Things Every EU Website Must Fix in 2026

The European Accessibility Act (EAA) has been enforced across all 27 EU member states since June 28, 2025. If your website serves European customers, it must meet WCAG 2.1 AA standards — or face fines up to EUR 300,000.

I've analyzed hundreds of websites and these are the 10 most common accessibility failures, with code-level fixes for each.

1. Missing Alt Text on Images

WCAG 1.1.1 — Non-text Content

This is the #1 failure across all websites we scan. Screen readers can't describe images without alt text, making visual content invisible to blind users.

<!-- Bad -->
<img src="hero.jpg">

<!-- Good -->
<img src="hero.jpg" alt="Team collaborating on accessibility audit">

<!-- Decorative (intentionally empty) -->
<img src="divider.svg" alt="">
Enter fullscreen mode Exit fullscreen mode

Rule: Every image needs alt. Decorative images get alt="" (empty, not missing).

2. Insufficient Color Contrast

WCAG 1.4.3 — Contrast (Minimum)

Light gray text on white backgrounds fails 78% of the sites we scan. The minimum contrast ratios:

  • Normal text (< 18pt): 4.5:1
  • Large text (>= 18pt or 14pt bold): 3:1
  • UI components and graphical objects: 3:1 
/* Bad: 2.5:1 contrast */
color: #999;
background: #fff;

/* Good: 7:1 contrast */
color: #333;
background: #fff;
Enter fullscreen mode Exit fullscreen mode

3. Missing Form Labels

WCAG 1.3.1 — Info and Relationships

Forms without <label> elements are unusable for screen reader users. They hear "edit text" with no context.

<!-- Bad -->
<input type="email" placeholder="Enter email">

<!-- Good -->
<label for="email">Email address</label>
<input type="email" id="email" placeholder="Enter email">
Enter fullscreen mode Exit fullscreen mode

Note: Placeholder text is NOT a substitute for labels. Placeholders disappear when typing.

4. No Keyboard Navigation

WCAG 2.1.1 — Keyboard

All interactive elements must be reachable with Tab key. The biggest culprits:

  • Custom dropdown menus built with <div> instead of <select>
  • Click handlers on non-focusable elements
  • outline: none with no visible alternative 
/* Bad: removes all focus indication */
*:focus { outline: none; }

/* Good: custom but visible focus */
*:focus-visible {
  outline: 2px solid #4A90D9;
  outline-offset: 2px;
}
Enter fullscreen mode Exit fullscreen mode

5. Missing Skip Navigation Link

WCAG 2.4.1 — Bypass Blocks

Keyboard users shouldn't tab through 50 navigation links on every page. Add a skip link:

<body>
  <a href="#main" class="skip-link">Skip to main content</a>
  <nav>...</nav>
  <main id="main">...</main>
</body>
Enter fullscreen mode Exit fullscreen mode

6. Auto-Playing Media

WCAG 1.4.2 — Audio Control

Auto-playing video or audio disorients screen reader users and can trigger issues for users with cognitive disabilities.

Fix: Never auto-play. If essential, provide an immediately visible pause button and keep it under 5 seconds.

7. Missing Language Attribute

WCAG 3.1.1 — Language of Page

Without lang, screen readers guess the language — often incorrectly, resulting in garbled pronunciation.

<html lang="en">
<!-- For inline foreign language -->
<p lang="fr">Bonjour le monde</p>
Enter fullscreen mode Exit fullscreen mode

8. Non-Descriptive Link Text

WCAG 2.4.4 — Link Purpose

Screen reader users often navigate by links. "Click here" tells them nothing about the destination.

<!-- Bad -->
<a href="/guide">Click here</a>

<!-- Good -->
<a href="/guide">Read the EAA compliance guide</a>
Enter fullscreen mode Exit fullscreen mode

9. Missing Heading Hierarchy

WCAG 1.3.1 — Info and Relationships

Screen reader users navigate by headings (H1-H6). Skipping levels breaks this navigation pattern.

<!-- Bad: H1 then H4 (skips H2, H3) -->
<h1>Home</h1>
<h4>Features</h4>

<!-- Good: sequential -->
<h1>Home</h1>
<h2>Features</h2>
<h3>Feature Detail</h3>
Enter fullscreen mode Exit fullscreen mode

10. No Accessibility Statement

EAA Article 14

The EAA specifically requires a public accessibility statement on every website. It must include:

  • Current WCAG compliance level (A, AA, or AAA)
  • Known limitations and workarounds
  • Contact information for accessibility feedback
  • Date of last accessibility audit

Check All 10 in 60 Seconds

FixMyWeb checks all 10 issues above — plus 191 more — in a single automated scan. The free tier covers 3 scans per month. It also generates an Accessibility Statement automatically.

EAA Fines by Country

Country Maximum Fine
Spain EUR 300,000
France EUR 250,000
Ireland EUR 200,000
Austria EUR 200,000
Germany EUR 100,000

Daily fines of approximately EUR 1,000 are possible until issues are resolved.

FAQ

Does the EAA apply to non-EU companies?

Yes. If your website serves EU customers, the EAA applies regardless of where your company is headquartered.

What WCAG level does the EAA require?

WCAG 2.1 Level AA is the baseline. Some member states may add additional requirements.

Can I use an overlay widget instead of fixing the code?

Overlays do not provide genuine compliance. Many accessibility experts and organizations advise against them. Fix the underlying code.

Scan your website: fixmyweb.dev — 201 checks, free tier. Also: CompliPilot for EU AI Act, CaptureAPI for screenshot API.

Top comments (0)