skills.rest
BenSheridanEdwards
BenSheridanEdwardsCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

accessibility-audit

Audit React frontends against a WCAG 2.2 AA accessibility baseline.

3|5|Updated Apr 26, 2026
Search Tags:#static analysis#accessibility#a11y#react#audit#wcag#aria
One-click install
npx skills add https://github.com/BenSheridanEdwards/ArchitectPlaybook --skill accessibility-audit-bensheridanedwards
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility-audit
Source: https://github.com/BenSheridanEdwards/ArchitectPlaybook/tree/main/accessibility-audit
Command: npx skills add https://github.com/BenSheridanEdwards/ArchitectPlaybook --skill accessibility-audit-bensheridanedwards

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Frontend teams often ship React applications without knowing whether they meet accessibility standards, and manual WCAG reviews are slow and inconsistent. This Skill statically audits a TypeScript/React codebase against an opinionated WCAG 2.2 AA baseline and produces structured findings plus an optional implementation plan. ## Core Features & Use Cases - Three-layer audit: Checks tooling and automation (eslint-plugin-jsx-a11y, axe-core, CI enforcement), component patterns (semantic HTML, ARIA, keyboard support, forms, contrast), and the application shell (landmarks, skip links, route announcements, document titles). - Structured findings contract: Writes findings.md, findings.json, snapshot.md, and metadata.json to .architect-audits/accessibility-audit/ using schema 2.0.0 for downstream scoring. - Framework-aware detection: Recognizes Next.js, Remix, Vite-React, and Create React App, and emits framework-specific hints for route announcements and title primitives. - Use Case: Run /accessibility-audit on a Next.js codebase before a release to get a Top 5 list of accessibility gaps, then confirm to generate an implementation plan for the fixes. ## Quick Start Ask the AI to run /accessibility-audit on your React project to receive a concise Top 5 accessibility findings summary and an optional implementation plan.

Frequently Asked Questions about accessibility-audit

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

FAQPage Schema
How do I audit a React app for WCAG accessibility issues?▼

Run /accessibility-audit in the project root. It statically checks tooling like eslint-plugin-jsx-a11y and axe-core, component patterns like semantic HTML and ARIA usage, and shell concerns like landmarks and skip links, then prints a Top 5 findings summary.

What accessibility checks does this audit cover?▼

It covers three layers: tooling and automation (lint plugin, axe in development, jest-axe or vitest-axe tests, end-to-end scans, CI enforcement), component patterns (keyboard support, focus management, forms, contrast, motion), and application shell (lang attribute, document titles, landmarks, route announcements).

Does the accessibility audit work with Next.js and Remix?▼

Yes, the audit detects Next.js, Remix, Vite-React, and Create React App from package.json and project structure. It emits framework-specific hints because route announcement, document title, and error page conventions differ across frameworks.

Can the audit fix accessibility violations automatically?▼

No, the audit is read-only and never accepts --apply. It writes descriptive findings and, only after explicit confirmation, generates an implementation plan; a separate fix step is responsible for mutating the codebase.

What are the limitations of a static accessibility audit?▼

It never starts a dev server or runs a live scanner, so screen-reader behavior, real keyboard focus order, and runtime-computed contrast ratios are out of scope. Those require human verification with assistive technology or a browser-based tool.

Related Skills

Explore More Software Engineering Skills→
Compass-BrandCompass-Brand

serena-code-architecture

Analyze codebase architecture and create knowledge graphs with Serena and Forgetful.

Official
Advanced
360org360org
1

github-issues-resolved

Automates GitHub issue triage, parallel fixes, code review, and merging via sub agents.

Community
Advanced
WynterJonesWynterJones
5

farm-inspect

Run parallel code quality, security, performance, and accessibility audits with linting and tests.

Community
Advanced
blackgirlbytesblackgirlbytes

audit-a11y-browser

Audit live browser accessibility against a URL using Playwright and axe-core.

Community
Intermediate