accessibility-compliance
- Use it when:
- You're building or auditing an interface for WCAG 2.2 AA or AAA, screen readers or keyboard-only use.
- It does:
- Gives the agent rules, such as native elements over ARIA, visible focus, text alternatives and live regions, and the common failures to look for.
- You get:
- Components written to those rules, with React examples of accessible buttons, modal dialogs, forms, skip links and announcements.
- Test with:
- Automated checks in axe DevTools, WAVE or Lighthouse, and manual ones with VoiceOver, NVDA, JAWS or TalkBack.
- Unlike accessibility:
- That one, from addyosmani/web-quality-skills, audits the rendered page and fixes what fails; this one is a reference with no steps of its own.
TL;DR
A reference, not a workflow. Its rules: prefer semantic HTML to ARIA, test with people with disabilities, design for the keyboard first, style focus outlines instead of removing them, give all non-text content a text alternative, keep pages working at 200% zoom, announce dynamic changes with live regions, and honour reduced-motion and contrast preferences. Common failures it names include missing alt text and labels, poor contrast, keyboard traps, auto-playing media, custom controls that rebuild native ones badly, missing skip links and a tab order that doesn't match the screen. A separate file covers WCAG's four principles, ARIA roles, states and live regions, keyboard focus and focus trapping, screen readers, and mobile (44-point touch targets, VoiceOver, TalkBack, Dynamic Type); a checklist of key WCAG 2.2 success criteria; React code for the components; and a contrast-ratio function with the AA and AAA thresholds.
Summarizes the skill at 4bde316.
npx skills add https://github.com/wshobson/agents --skill accessibility-compliance skills.sh pageSource on GitHubAll skills from wshobson/agents
- Total Downloads
- 15,200 on skills.sh, Nov 9, 2026
- Repo stars
- 42,334 wshobson/agents
- First seen
- Jan 20, 2026 on skills.sh
Weekly values
| Week to | Installs |
|---|---|
| Sep 21 | 268 |
| Sep 28 | 279 |
| Oct 5 | 333 |
| Oct 12 | 269 |
| Oct 19 | 241 |
| Oct 26 | 270 |
| Nov 2 | 284 |
| Nov 9 | 212 |
| Category |
Taste for interfaces that don't look generated: direction, motion and accessibility. Everything for building software: planning, coding, debugging, design, frameworks, cloud, agents and skills. |
|---|---|
| Type |
Knowledge and rules the agent applies while it works: best practices, design principles, API references. |
| Effect |
Adds no side effects of its own. It shapes how the agent thinks, writes or reviews. Guidelines and routers are always effect:none, even when the task they support edits code. |
| Needs |
Instructions only. Works in any agent that supports skills. |
| Publisher |
Everyone else. Unverified vendor claims default to community. |
| Topics |
SKILL.md
From wshobson/agents at 4bde316. Checked daily, last changed Nov 6, 2026.
Frontmatter
name: accessibility-compliance
description: Implement WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, implementing ARIA patterns, building for screen readers, or ensuring inclusive user experiences.Accessibility Compliance
Master accessibility implementation to create inclusive experiences that work for everyone, including users with disabilities.
When to Use This Skill
- Implementing WCAG 2.2 Level AA or AAA compliance
- Building screen reader accessible interfaces
- Adding keyboard navigation to interactive components
- Implementing focus management and focus trapping
- Creating accessible forms with proper labeling
- Supporting reduced motion and high contrast preferences
- Building mobile accessibility features (iOS VoiceOver, Android TalkBack)
- Conducting accessibility audits and fixing violations
Detailed patterns and worked examples
Detailed pattern documentation lives in references/details.md. Read that file when the navigation tier above is insufficient.
Best Practices
- Use Semantic HTML: Prefer native elements over ARIA when possible
- Test with Real Users: Include people with disabilities in user testing
- Keyboard First: Design interactions to work without a mouse
- Don't Disable Focus Styles: Style them, don't remove them
- Provide Text Alternatives: All non-text content needs descriptions
- Support Zoom: Content should work at 200% zoom
- Announce Changes: Use live regions for dynamic content
- Respect Preferences: Honor prefers-reduced-motion and prefers-contrast
Common Issues
- Missing alt text: Images without descriptions
- Poor color contrast: Text hard to read against background
- Keyboard traps: Focus stuck in component
- Missing labels: Form inputs without associated labels
- Auto-playing media: Content that plays without user initiation
- Inaccessible custom controls: Recreating native functionality poorly
- Missing skip links: No way to bypass repetitive content
- Focus order issues: Tab order doesn't match visual order
Testing Tools
- Automated: axe DevTools, WAVE, Lighthouse
- Manual: VoiceOver (macOS/iOS), NVDA/JAWS (Windows), TalkBack (Android)
- Simulators: NoCoffee (vision), Silktide (various disabilities)