Overview

Perform a thorough audit of the current UI against WCAG 2.1 guidelines to ensure an inclusive user experience. It covers semantic HTML, keyboard navigation, color contrast, screen reader support, and dynamic content announcements, plus concrete remediation guidance.

How This Skill Works

The skill evaluates WCAG conformance, validates ARIA labels and heading structures, checks focus management and dialog accessibility, and combines automated tools with manual testing to produce actionable remediation steps and code fixes.

When to Use It

• Before launching a new UI or feature to ensure WCAG 2.1 compliance.
• After major UI changes or refactors that may affect accessibility.
• When explicit accessibility requirements are requested by stakeholders (not for routine implementations).
• During QA cycles to verify keyboard navigation, screen reader support, and focus management.
• To generate concrete remediation guidance and accessible component patterns.

Quick Start

1. Step 1: Review WCAG 2.1 conformance and verify semantic HTML structure.
2. Step 2: Validate ARIA attributes, heading hierarchy, labels, and focus management.
3. Step 3: Run automated accessibility tests, perform manual checks, and capture remediation steps with code examples.

Best Practices

• Align audits with WCAG 2.1 A, AA, and AAA levels and verify semantic HTML structure.
• Prioritize keyboard accessibility: ensure logical focus order, visible focus indicators, and usable shortcuts.
• Validate ARIA attributes and screen reader announcements across components.
• Combine automated tooling with thorough manual testing and real user scenarios.
• Provide concrete code fixes, ARIA improvements, and accessible component patterns.

Example Use Cases

• Audit a login flow for proper labels, focus management, and ARIA descriptions.
• Review a modal/dialog to ensure focus traps and accurate screen reader announcements.
• Check color contrast and scalable typography in a dashboard with charts and tables.
• Verify form validation messages are accessible and announced by screen readers.
• Evaluate dynamic content updates to ensure correct ARIA live region behavior.

Frequently Asked Questions