screen-reader-testing_skill

Overview

This skill helps validate web accessibility by testing with NVDA, JAWS, VoiceOver and other screen readers while checking ARIA attributes and semantic HTML. It focuses on ensuring content is announced correctly, interactive elements are labeled, and dynamic changes are communicated to assistive technologies. Use it to find and fix real-world issues that affect blind and low-vision users.

How this skill works

The skill walks through common navigation patterns (headings, links, forms, landmarks, tables) on target pages with multiple screen readers and devices. It inspects ARIA roles, states, live regions, label associations, focus management, and keyboard behavior. Results highlight missing labels, incorrect roles, unannounced dynamic updates, and semantic HTML regressions. Actionable recommendations map issues to code-level fixes like adding labels, live regions, or semantic elements.

When to use it

• During accessibility audits and QA cycles
• After UI changes or refactors
• When validating ARIA implementations
• Before production deploys or releases
• For mobile and cross-platform accessibility checks

Best practices

• Prefer semantic HTML (button, nav, main) before ARIA
• Test with multiple screen readers and keyboards together
• Use explicit labels and associate them with controls
• Announce dynamic updates with appropriate aria-live roles
• Provide skip links, meaningful headings, and focus management

Example use cases

• Test a product search autocomplete to ensure results are announced and focus moves correctly
• Validate a modal dialog traps focus, announces title and errors
• Check form fields announce errors and required state on submission
• Audit table markup to ensure headers and cell context are exposed
• Verify toast and live updates are announced via aria-live regions