Does this skill support WCAG 2.1 standards?

Yes, it specifically targets WCAG Level AA compliance, which is the recognized industry standard for most commercial and public web projects.

How does it handle complex components like modals?

It provides specific focus management logic, including focus trapping and ARIA roles, to ensure modals are fully accessible to keyboard and assistive technology users.

Can it help me fix existing accessibility issues?

Absolutely. The skill provides patterns for refactoring non-semantic code and adding proper ARIA attributes to existing components to improve their accessibility.

Does it include testing strategies?

Yes, it covers both automated testing patterns using tools like jest-axe and comprehensive manual testing checklists for screen readers and keyboard-only use.

Accessibility Patterns & WCAG Compliance

Name: Accessibility Patterns & WCAG Compliance
Author: organvm-iv-taxis

byorganvm-iv-taxis

•

Design Tools

Builds inclusive web experiences by implementing WCAG guidelines, semantic HTML, and accessible ARIA patterns.

This skill empowers developers to create universally accessible web applications by integrating Web Content Accessibility Guidelines (WCAG) directly into the development workflow. It provides comprehensive guidance on semantic HTML structures, keyboard navigation logic, color contrast requirements, and proper ARIA implementation. Whether you're building a simple landing page or a complex web application, this skill ensures your code meets Level AA standards, improves screen reader compatibility, and enhances the user experience for individuals with disabilities.

Key Features

012 GitHub stars

02Comprehensive keyboard navigation and focus management strategies

03Implementation of WCAG 2.1 Level AA standards for legal and ethical compliance

04Accessible ARIA patterns for complex UI components like modals, tabs, and menus

05Guidance on color contrast ratios and inclusive visual design

06Semantic HTML mapping to replace non-accessible div and span patterns

Use Cases

01Refactoring legacy codebases into semantic, screen-reader-friendly HTML

02Performing accessibility audits and implementing remediation strategies for web apps

03Building custom UI widgets that require complex keyboard interaction and state management

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add organvm-iv-taxis/a-i--skills accessibility-patterns

For use in Claude.ai and ChatGPT

Download Skill