Next.js EN 301 549 Checker

EN 301 549 for Next.js Sites

EN 301 549 is the European standard for accessible information and communication technology. For websites, its clause 9 reuses WCAG: version 3.2.1 uses WCAG 2.1 Level AA, and version 4.1.1, published in September 2026 for the European Accessibility Act, uses WCAG 2.2 Level AA.

The European Accessibility Act has applied to e-commerce and other consumer services since June 28, 2025, wherever the business is based. This checker runs the scan with the EN 301 549 preset, which tests the WCAG 2.1 AA web requirements. Run the Next.js WCAG 2.2 checker as well to cover version 4.1.1.

For Next.js apps serving EU users, EN 301 549 also has clauses for software. Scan the rendered pages here and add accessibility tests to your components and release process.

Who Should Run the Next.js EN 301 549 Checker

• Next.js businesses that sell products or services to consumers in the EU.
• Public sector bodies in the EU running a site on Next.js.
• Vendors selling software or services to EU public bodies.
• Non-EU companies with EU customers, since the EAA follows the customer.

EN 301 549 Requirements to Check on Next.js

• 1.4.10 Reflow

  Pages must reflow on a narrow screen without scrolling in two directions.

• 1.4.11 Non-text Contrast

  Controls, icons and focus indicators need 3:1 contrast.

• 3.1.1 Language of Page

  Each page must declare its language, which matters on multilingual EU sites.

• 3.3.2 Labels or Instructions

  Form fields, including checkout and consent forms, need visible labels or instructions.

• 4.1.2 Name, Role, Value

  Custom controls such as cookie consent switches need a name, role and state.

• 4.1.3 Status Messages

  Status messages, such as cart updates and form errors, must be announced.

Where Next.js Sites Usually Fail EN 301 549

These problems come up again and again on Next.js sites, and each one fails EN 301 549. The Next.js accessibility checker explains how to fix them in Next.js.

• Client-side route changes. Navigation without a page load needs a unique title for each route and sensible focus handling, or screen reader and keyboard users do not know the page has changed.
• next/image alt text. The image component asks for an alt prop, but it is often set to a file name, left generic or filled with an empty string on images that carry meaning.
• Page language and metadata. A hard-coded or missing lang attribute in the root layout, and the same title on every route, affect every page on the site.
• Custom dialogs, menus and dropdowns. Components built from divs and click handlers, rather than buttons and links, are missing roles, names and keyboard support.
• Loading and error states. Skeletons, spinners and streamed content appear without being announced, and form errors rendered by client components often are not tied to their fields.

Worried about ADA claims as well? The Next.js ADA compliance checker covers the Next.js risks behind most complaints.

What to Test by Hand on Next.js

Automated testing finds many, but not all, EN 301 549 failures. Check these yourself after the scan:

1. Check every language version, including the page language setting (3.1.1).
2. Test the cookie consent banner with a keyboard and screen reader.
3. Publish accessibility information for your service, as the EAA requires.
4. Rescan after each fix. Continuous monitoring rescans up to 500 URLs per domain daily and keeps a dated record in the Compliance Vault.

Start 3-day free trial

Related Guides

• EN 301 549 CheckerThe EN 301 549 standard in full, for any website.
• WCAG 4.1.3 Status Messages Explained in Plain EnglishWCAG 4.1.3 Status Messages explained simply: what counts, how to announce it with role status, alert, progressbar or aria-live, form errors and how to test.
• WCAG 4.1.2 Name, Role, Value Explained in Plain EnglishWCAG 4.1.2 Name, Role, Value explained simply: give every control a name, role and state with native HTML and ARIA, with code examples and how to test.
• Keyboard Accessibility TestingA practical guide to keyboard accessibility testing: what to check, the exact keys to use, and a component-by-component reference table mapped to WCAG.
• WCAG Success Criteria LibraryLook up any criterion the scan flags, in plain language.

Next.js EN 301 549 Checker: Frequently Asked Questions