Stats
Actions
Tags
From f5-core
Implements web accessibility guidelines including WCAG POUR principles, semantic HTML, ARIA roles, keyboard navigation, color contrast, media captions, and testing with axe/Lighthouse.
How this skill is triggered — by the user, by Claude, or both
Slash command
/f5-core:accessibilityThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
Web accessibility (a11y) ensures websites are usable by everyone, including people with disabilities. Accessible design benefits all users and is often required by law.
aria/aria-basics.mdaria/aria-live-regions.mdaria/aria-roles.mdaria/aria-states.mdcomponents/accessible-buttons.mdcomponents/accessible-forms.mdcomponents/accessible-modals.mdcomponents/accessible-tables.mdfundamentals/accessibility-principles.mdfundamentals/disability-types.mdfundamentals/wcag-overview.mdhtml/forms.mdhtml/headings.mdhtml/landmarks.mdhtml/semantic-html.mdkeyboard/focus-management.mdkeyboard/keyboard-navigation.mdkeyboard/skip-links.mdmedia/audio-transcripts.mdmedia/images-alt-text.mdWeb accessibility (a11y) ensures websites are usable by everyone, including people with disabilities. Accessible design benefits all users and is often required by law.
| Principle | Description | Examples |
|---|---|---|
| Perceivable | Info must be presentable to users | Alt text, captions, contrast |
| Operable | UI must be operable by everyone | Keyboard access, timing |
| Understandable | Info and UI must be understandable | Clear labels, error handling |
| Robust | Content must work with assistive tech | Valid HTML, ARIA |
| Level | Description | Target Audience |
|---|---|---|
| A | Minimum accessibility | Basic requirements |
| AA | Recommended standard | Most organizations (legal requirement) |
| AAA | Enhanced accessibility | Specialized applications |
Core accessibility concepts:
Semantic structure:
Accessible Rich Internet Applications:
Keyboard accessibility:
Visual accessibility:
Multimedia accessibility:
Accessibility testing:
Accessible patterns:
| Requirement | Guideline | Check |
|---|---|---|
| Color contrast (normal text) | 4.5:1 | Tools |
| Color contrast (large text) | 3:1 | Tools |
| Focus visible | 2.4.7 | Manual |
| Keyboard accessible | 2.1.1 | Manual |
| Alt text for images | 1.1.1 | Automated |
| Form labels | 1.3.1 | Automated |
| Error identification | 3.3.1 | Manual |
| Page titled | 2.4.2 | Automated |
- [ ] Can navigate with keyboard only
- [ ] Focus indicator is visible
- [ ] Color contrast meets requirements
- [ ] Images have alt text
- [ ] Forms have labels
- [ ] Headings are hierarchical
- [ ] Links are descriptive
- [ ] Errors are announced
- [ ] Works with screen reader
| Region | Law | Standard |
|---|---|---|
| USA | ADA, Section 508 | WCAG 2.1 AA |
| EU | European Accessibility Act | WCAG 2.1 AA |
| UK | Equality Act | WCAG 2.1 AA |
| Canada | AODA | WCAG 2.0 AA |
| Tool | Purpose | Type |
|---|---|---|
| axe DevTools | Browser testing | Extension |
| WAVE | Visual inspection | Extension |
| Lighthouse | Audit | Browser |
| Pa11y | CI integration | CLI |
| NVDA | Screen reader | Application |
| VoiceOver | Screen reader | macOS/iOS |
npx claudepluginhub fujigo-software/f5-framework-claude --plugin f5-coreGuides implementation of WCAG web accessibility (POUR principles) for UI components, forms, navigation, and multimedia. Use when designing, reviewing, or refactoring interfaces for compliance.
Implements WCAG web accessibility (POUR principles) for UI components, forms, navigation, and multimedia. Use when designing, reviewing, or refactoring web interfaces for compliance.
Implements WCAG 2.1/2.2 accessibility patterns for inclusive UIs: ARIA, keyboard navigation, color contrast, focus management, and testing strategies.