How do I test my site for accessibility?

Automated tools (axe, WAVE, Lighthouse) catch 30-40% of accessibility issues in minutes. The remaining 60-70% require manual testing: keyboard-only navigation through your full purchase flow, and screen reader testing with NVDA or VoiceOver. Both types are essential.

Start with automated testing

Automated accessibility testing is fast, repeatable, and free for basic use. It catches the clear-cut violations: missing alt text, insufficient color contrast, missing form labels, and invalid ARIA usage.

axe browser extension (recommended starting point) Available for Chrome and Firefox. Runs on any page you’re viewing, reports issues by severity (Critical, Serious, Moderate, Minor), and links each finding to a detailed explanation. The free version catches the most impactful issues. Run it on: your homepage, a product page, a category page, and each step of your checkout.

WAVE (webaim.org/wave) Visual overlay tool that highlights accessibility errors and warnings directly on the page. Particularly useful for non-developers because it shows issues in context, not just as a list. Paste any URL or install the browser extension.

Google Lighthouse Built into Chrome DevTools (F12 > Lighthouse tab). Run an accessibility audit alongside performance, SEO, and best practices. Scores 0-100, where 90+ is a reasonable target. Useful for tracking improvement over time. Note: a score of 100 doesn’t mean full WCAG compliance — it means the automatable checks pass.

Axe-core in CI/CD For development teams, integrating axe-core into your automated test suite (via jest-axe or Playwright/Cypress plugins) catches accessibility regressions before they reach production. This is the most efficient long-term approach for maintaining accessibility.

Manual keyboard testing

Keyboard testing takes 15-30 minutes and reveals issues that no automated tool can detect: logical focus order, functional keyboard interactions on custom components, focus trap behavior in modals.

The keyboard testing protocol:

1. Open your site and close your mouse (physically unplug or disable it)
2. Press Tab to move forward through interactive elements, Shift+Tab to move backward
3. Note: Can you see which element has focus at every step? (Focus must always be visible)
4. Press Enter or Space to activate buttons and links
5. Use Arrow keys to navigate within dropdowns, radio groups, and carousels
6. Press Escape to close modals and dropdowns — does focus return to the triggering element?

Complete this process through your entire purchase flow: product discovery, variant selection, add to cart, cart review, checkout (all steps), and order confirmation.

Document every point where you can’t proceed or where focus behavior is confusing. These are blocking issues for keyboard-only users.

What to look for specifically in e-commerce:

• Can you reach the size/variant selector and make a selection?
• Can you activate “Add to Cart”?
• Does focus enter the cart sidebar correctly when opened?
• Can you navigate and complete each checkout step?
• Do modal dialogs (size guides, quick view) trap focus correctly and close properly?

Screen reader testing

Screen readers translate visual content into audio or braille output. Testing with a screen reader reveals how your site is actually experienced by users with visual impairments — not just whether the ARIA is technically correct.

NVDA (Windows) — free Download from nvaccess.org. Use with Firefox for best compatibility. Enable it and navigate your site using keyboard shortcuts: H for headings, B for buttons, F for form fields, T for tables, arrow keys to read content sequentially.

VoiceOver (Mac and iOS) — built-in Enable on Mac: Command+F5. On iPhone/iPad: Settings > Accessibility > VoiceOver. Use rotor gestures (two-finger rotation) to navigate by element type. Test the checkout flow on both desktop and mobile.

JAWS (Windows) — paid, but standard in enterprise testing The most widely used screen reader by professional users. If your target audience includes business customers, JAWS testing is important. 30-day free trial available.

What to listen for:

• Are buttons announced with their purpose? (“Add to Cart, button” not “button”)
• Are images described? (“Midnight blue linen dress, front view” not “image”)
• Are form fields announced with their labels? (“Email address, required” not “text field”)
• Are error messages announced when they appear?
• Are dynamic updates announced? (When cart updates, is the change communicated?)

Color contrast testing

WebAIM Contrast Checker: Enter hex codes for foreground and background colors, get the contrast ratio and pass/fail result immediately. Fast for spot-checking specific color combinations.

Chrome DevTools color picker: Inspect any text element, click the color swatch in the Styles panel, see the contrast ratio calculated automatically against the current background.

Stark (browser extension): Runs a contrast check across an entire page and can simulate color blindness to show how your site appears to users with different types of color vision deficiency.

Building a sustainable testing process

Before launch (new features/redesigns): Manual keyboard and screen reader testing of all new interactive components.

Monthly: Automated axe scan of all key page templates. Review new issues introduced since last scan.

Quarterly: Full manual keyboard testing of the purchase flow. Screen reader testing of any new checkout functionality.

Annually: Comprehensive audit against full WCAG 2.1 AA checklist. Particularly important if your site has grown significantly or undergone major changes.

A UX audit provides a complete accessibility baseline test with findings prioritized by severity and user impact — a faster alternative to building your own testing infrastructure from scratch.