wcag-audit-patterns
Audit websites for WCAG 2.2 accessibility compliance
Ăgalement disponible depuis: wshobson
Manual accessibility audits are slow and error-prone without structured guidance. This skill provides systematic WCAG 2.2 checklists, automated testing integration, and proven remediation patterns.
Télécharger le ZIP du skill
Importer dans Claude
Allez dans ParamĂštres â CapacitĂ©s â Skills â Importer un skill
Activez et commencez Ă utiliser
Tester
Utilisation de "wcag-audit-patterns". Audit my navigation menu for accessibility issues
Résultat attendu:
Found 4 WCAG violations: Missing skip link (2.4.1 A), keyboard trap in dropdown (2.1.2 A), missing aria-expanded state (4.1.2 A), and insufficient focus indicator contrast (2.4.7 AA). Fixed navigation code includes skip link, proper focus trapping, ARIA states, and 3px solid focus outline with 4.5:1 contrast.
Utilisation de "wcag-audit-patterns". Fix color contrast errors on my login form
Résultat attendu:
Original gray text (#888888) has 2.8:1 contrast on white background. Updated to #595959 for 4.5:1 AA compliance. Error state now uses red (#D32F2F) with icon and text message, not color alone. Focus indicator changed to 3px blue outline visible at 4.6:1 contrast ratio.
Audit de sécurité
SûrStatic analyzer flagged 76 patterns but all are false positives. The skill contains Markdown documentation with code examples, not executable code. Detected backticks are markdown fences, URLs are reference links, and no actual shell execution, network calls, or credential access exists.
Score de qualité
Ce que vous pouvez construire
E-commerce Accessibility Audit
Audit an online store for WCAG 2.2 AA compliance before a product launch. Run automated scans on key pages, perform manual keyboard testing on checkout flow, and fix critical barriers like missing form labels and keyboard traps.
Government Website Compliance
Review a public sector website for Section 508 and ADA compliance. Document all violations, prioritize by user impact, and provide remediation code that meets federal accessibility standards.
Accessibility Lawsuit Remediation
Respond to an accessibility demand letter by auditing the cited pages, identifying all WCAG violations, and implementing fixes with documented evidence for legal defense.
Essayez ces prompts
Audit the homepage of my website for WCAG 2.2 Level A violations. List all issues found, explain why each violates WCAG, and provide fixed code examples for each problem.
Review my custom dropdown menu component for accessibility issues. Check keyboard navigation, focus management, ARIA attributes, and screen reader compatibility. Provide corrected code that passes WCAG 2.2 AA.
Conduct a complete WCAG 2.2 AA audit of my e-commerce site. Include automated testing setup with axe-core, manual testing checklist for keyboard and screen reader flows, and a prioritized remediation plan with code fixes for all violations.
Analyze my design system colors for WCAG 2.2 contrast compliance. Test all text-background combinations at normal and large sizes, check UI component contrast ratios, and suggest accessible color alternatives that maintain brand identity.
Bonnes pratiques
- Start accessibility testing during design phase, not after development
- Use semantic HTML elements before adding ARIA attributes
- Test with keyboard only and at least one screen reader before publishing
Ăviter
- Relying only on automated testing tools without manual verification
- Hiding focus outlines for visual design preferences
- Using color as the only indicator for errors or required fields