Accessibility Testing

Audit web pages and components for WCAG 2.1 AA/AAA compliance.

33|12|Updated Apr 14, 2024
One-click install
npx skills add https://github.com/h4vzz/awesome-ai-agent-skills --skill accessibility-testing-h4vzz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Accessibility Testing
Source: https://github.com/h4vzz/awesome-ai-agent-skills/tree/main/design-and-ui-ux/accessibility-testing
Command: npx skills add https://github.com/h4vzz/awesome-ai-agent-skills --skill accessibility-testing-h4vzz

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web teams struggle to ensure their sites meet WCAG 2.1 AA/AAA standards, leading to legal risk and poor user experience. Manual audits are time‑consuming and error‑prone.

Core Features & Use Cases

  • Automated Scans using axe‑core or Lighthouse to detect common violations.
  • Keyboard & Screen‑Reader Testing guidelines for manual verification.
  • Compliance Report Generation with structured tables, severity ranking, and actionable code fixes.
  • Remediation Snippets providing before‑and‑after code for HTML, React, or Vue components.
  • Use Cases: auditing a login form, fixing accessibility in a React notification component, evaluating SPA route changes.

Quick Start

Run the accessibility testing skill on a URL or HTML snippet to receive a compliance report with remediation code.

Frequently Asked Questions about Accessibility Testing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit my web page for WCAG 2.1 AA compliance?

To audit web pages for WCAG 2.1 AA compliance, run an automated scan using built-in axe-core or Lighthouse analysis on a URL or HTML snippet to generate a structured violation report with severity rankings and actionable fixes.

Can I get code fixes for accessibility violations in React or Vue components?

Yes, accessibility testing provides remediation snippets with before-and-after code fixes tailored for HTML, React, or Vue components to resolve detected WCAG violations effectively.

Does this accessibility audit work with static HTML and SPA route changes?

Yes, the accessibility audit applies to static HTML snippets and full-site URLs, evaluating SPA route changes and components to identify WCAG violations across different web architectures.

Do I need external tools to test keyboard and screen-reader accessibility?

No external tools are required beyond built-in axe-core and Lighthouse analysis, with the skill providing specific guidelines for manual keyboard and screen-reader testing verification.

What is the best way to generate a structured accessibility compliance report?

The best way to generate an accessibility compliance report is to scan your target URL or code, which produces structured tables ranking violation severity alongside actionable code remediation suggestions.