accessibility

Audit and fix web accessibility issues against WCAG 2.2 guidelines.

Updated May 24, 2026
One-click install
npx skills add https://github.com/MWest2020/skill-forge --skill accessibility-mwest2020
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/MWest2020/skill-forge/tree/main/skills/accessibility
Command: npx skills add https://github.com/MWest2020/skill-forge --skill accessibility-mwest2020

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Web interfaces often ship with accessibility barriers—missing alt text, low contrast, keyboard traps, unlabeled forms—that block users with disabilities and create legal compliance risk. This Skill provides a structured WCAG 2.2 audit workflow and copy-paste-ready fixes so issues are found and resolved systematically. ## Core Features & Use Cases - Evidence-led audits: Run Lighthouse or axe accessibility audits, inspect the rendered accessibility tree, and localize failures to specific components instead of guessing. - WCAG 2.2 coverage by POUR principle: Concrete HTML/CSS/JS guidance for Perceivable, Operable, Understandable, and Robust criteria, including the new 2.2 rules like target size, dragging movements, and accessible authentication. - Ready-made patterns: Reference files provide modal focus traps, skip links, ARIA tabs, live regions, error handling, and screen reader command cheat sheets. - Use Case: A developer is told their checkout flow fails an a11y review. They run a Lighthouse audit, find unlabeled form fields and a keyboard trap in the modal, then apply the form-label and focus-trap patterns to fix both before release. ## Quick Start Audit this page for WCAG 2.2 accessibility issues and fix the failing components.

Frequently Asked Questions about accessibility

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

FAQPage Schema
How do I audit a website for WCAG 2.2 accessibility compliance?

Run a Lighthouse accessibility audit or axe scan to get failing nodes, then inspect the rendered accessibility tree for names, roles, and landmarks. Fix issues at the source and re-run the same audit, since automated tools only catch a subset of barriers.

How to make a modal dialog keyboard accessible?

Trap focus inside the modal by cycling Tab and Shift+Tab through its focusable elements and closing on Escape. The native HTML <dialog> element handles focus trapping automatically and is preferred when browser support allows.

What color contrast ratio is required for WCAG AA compliance?

WCAG AA requires 4.5:1 contrast for normal text and 3:1 for large text (18px+ or 14px+ bold). UI components and focus indicators need at least 3:1 contrast against adjacent colors.

Does a Lighthouse accessibility score of 100 mean WCAG conformance?

No. Automated tools detect only a subset of accessibility barriers, so a score of 100 is not WCAG conformance. Manual testing with keyboard navigation, screen readers like VoiceOver or NVDA, and zoom checks is still required.

What accessibility requirements are new in WCAG 2.2?

WCAG 2.2 adds target size minimums of 24x24 CSS pixels, dragging movement alternatives, focus not obscured rules, consistent help placement, redundant entry prevention, and accessible authentication without cognitive function tests.