European Accessibility Act

EAA compliance for WooCommerce: WCAG 2.1 AA checklist & fixes

WooCommerce inherits accessibility from the active WordPress theme and the plugins layered on top. The catch is that almost any plugin can inject markup — a slider, a popup, a chatbot — that breaks the theme's carefully tuned accessibility. EAA compliance for WooCommerce is mostly a hygiene exercise: pick an accessibility-ready theme, audit the storefront with the plugins you actually use enabled, and fix focus, labels, and contrast. Powers ~28% of all online stores via WordPress; popular among EU SMBs subject to the EAA.

Category
E-commerce platform
Standard
WCAG 2.1 Level AA via EN 301 549
Deadline
28 June 2025 (EU consumer services)
Risk for B2C
High — public-facing, consumer-billed

What the EAA actually requires from a WooCommerce site

The European Accessibility Act (Directive 2019/882) applies to consumer-facing online services from 28 June 2025. For a WooCommerce site selling to EU consumers, that means the storefront, checkout, account area, and any embedded payment flow have to meet WCAG 2.1 Level AA via the harmonised standard EN 301 549. Microenterprises with under 10 employees and below €2 million in turnover are exempt for services, but not for products.

Fines vary by member state. Germany caps individual penalties at €100,000; France can fine up to 4% of group turnover; Spain reaches €600,000 for serious or repeated breaches. None of those numbers are theoretical — market surveillance authorities have already started auditing storefronts in Germany and France in the run-up to enforcement.

In practice, the work breaks down into three buckets: theme-level fixes (focus styles, contrast, semantics), interaction-level fixes (carousels, modals, drawers, gallery widgets), and content-level fixes (alt text, headings, descriptive link text). The list below covers the WooCommerce-specific failure points we see most often during scans.

Top WCAG failures we see on WooCommerce sites

Across hundreds of WooCommerce scans, the same handful of issues show up over and over. None of them require ripping the theme apart — most are fixable in a few hours by someone comfortable in the platform's editor or template files.

  • Plugin conflicts that break keyboard navigation

    Quick-view, wishlist, and currency-switcher plugins frequently override theme JS and remove keyboard handlers from product cards.

    2.1.1 Keyboard — Level A
  • Cart and checkout messages announced as decoration

    WooCommerce notice messages render as <div class="woocommerce-message"> without role="status" or aria-live, so screen readers miss "Coupon applied" or "Item added".

    4.1.3 Status Messages — Level AA
  • Variation dropdowns without labels

    Color and size selectors auto-generate <select> elements that some themes fail to label, leaving "Choose an option" as the only context for assistive tech.

    1.3.1, 4.1.2 — Level A
  • Theme search and modal popups stealing focus

    Newsletter and exit-intent popups that auto-open and trap focus on page load are still common in WP theme bundles.

    2.4.3 Focus Order, 2.1.2 No Keyboard Trap — Level A

Concrete code fixes for WooCommerce

Below are copy-paste fixes for the most common WooCommerce issues. They assume you have access to your theme code or the platform's custom-code injection panel. If you cannot edit code directly, share these snippets with whoever maintains the site — every one of them is a ten-minute change.

PHP: announce WooCommerce notices as polite live regions

PHP
add_filter('woocommerce_add_notice', function ($notice, $type) {
    $role = $type === 'error' ? 'alert' : 'status';
    return '<div class="woocommerce-message" role="' . esc_attr($role) . '" aria-live="polite">' . $notice . '</div>';
}, 10, 2);

Wraps notices in role="status" / role="alert" so screen readers announce coupon, cart, and checkout feedback.

Theme functions.php: skip-link target and focus styles

PHP
add_action('wp_body_open', function () {
    echo '<a class="skip-link" href="#main">Skip to main content</a>';
});

Adds a WCAG-required skip link before any navigation. Pair with CSS :focus styles in your theme.

Tools and plugins worth installing first

  • WP Accessibility plugin — adds skip links, language attributes, and form label sanity

  • Disable autoplay carousels and video sliders site-wide via theme settings

  • Certvo scan against /shop, /cart, /checkout, and a single product URL

How to scan a WooCommerce site without missing anything

Automated scanners catch about 30–40% of WCAG issues; the rest need manual review. The good news is that the 30–40% includes the most expensive issues to remediate after the fact, so an automated scan is the cheapest way to get unstuck. Run one before you change a line of theme code.

  • Always scan with the plugins you ship in production active. Plugins are the #1 source of accessibility regressions on WP.

  • Re-test after WooCommerce or theme updates; markup changes break previously-passing pages.

  • Crawl a logged-in cart and checkout — these have payment-method UIs that are easy to miss.

Run a free public scan against any WooCommerce URL right now — no signup, results in 60 seconds.

Frequently asked questions

Is the default WooCommerce checkout WCAG 2.1 AA out of the box?

It is close. Field labels are programmatic and required-field markers are correct. The remaining issues come from your theme's CSS (contrast, focus states) and any payment plugin you add.

Do I need a separate accessibility plugin?

A plugin like WP Accessibility helps with structural items (skip links, language tags). It does not replace theme-level fixes for color, focus, or keyboard interaction.

Other e-commerce platform platforms

Find every accessibility issue on your site in 60 seconds.

Free public scan. No card. AI-generated fixes for every issue we find.