wcag-accessibility

Review frontend code for WCAG 2.2 accessibility compliance.

Updated May 29, 2026
One-click install
npx skills add https://github.com/InnoMikitaKutas/accelerator-test-task --skill wcag-accessibility-innomikitakutas
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wcag-accessibility
Source: https://github.com/InnoMikitaKutas/accelerator-test-task/tree/main/.claude/skills/wcag-accessibility
Command: npx skills add https://github.com/InnoMikitaKutas/accelerator-test-task --skill wcag-accessibility-innomikitakutas

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide to ensure web interfaces are accessible according to WCAG 2.2 Level AA, helping developers review, write, and audit accessible web content.

Core Features & Use Cases

  • Semantic HTML Guidance: Offers rules for correct HTML semantics for screen readers.
  • Keyboard Accessibility: Ensures all functionality is operable via keyboard alone.
  • ARIA Usage: Provides guidelines on when and how to use ARIA for enhanced accessibility.
  • Color & Contrast Standards: Ensures sufficient contrast for readability.
  • Forms & Input Best Practices: Covers proper labeling and error handling for forms.
  • Media & Image Alternatives: Ensures text alternatives for non-text content.
  • Motion & Animation Controls: Respects user preferences for reduced motion.
  • Responsive Design: Ensures content remains usable when zoomed or resized.
  • Use Case: When developing a new web application, this Skill can be used to ensure that all accessibility requirements are met, preventing future issues and improving user experience.

Quick Start

Analyze the frontend code of a web application for WCAG 2.2 compliance using the wcag-accessibility skill.

Frequently Asked Questions about wcag-accessibility

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

FAQPage Schema
How do I check frontend code for WCAG 2.2 compliance?

To check frontend code for WCAG 2.2 compliance, review semantic HTML, keyboard accessibility, ARIA usage, color contrast, forms, media, motion, and responsive design against established Level AA guidelines to identify and resolve accessibility issues.

What is proper ARIA usage for screen reader accessibility?

Proper ARIA usage for screen reader accessibility involves applying ARIA attributes only when semantic HTML is insufficient, enhancing screen reader interactions without duplicating native browser semantics or creating redundant navigation elements.

How do I ensure forms are keyboard accessible and screen reader friendly?

Ensure forms are keyboard accessible and screen reader friendly by implementing proper labeling, logical tab order, and clear error handling so all input fields and functionalities remain fully operable via keyboard alone.

Does WCAG 2.2 Level AA require specific color contrast standards?

WCAG 2.2 Level AA requires specific color contrast standards to ensure sufficient readability, mandating distinct contrast ratios between text and background colors for accessible web content across all responsive viewport sizes.

How do I handle motion and animation for accessibility compliance?

Handle motion and animation for accessibility compliance by providing controls to pause, stop, or hide moving content, and by strictly respecting user system preferences for reduced motion to prevent vestibular triggers.

What are the limitations of automated accessibility reviews for responsive design?

Automated accessibility reviews for responsive design face limitations detecting context-specific semantic HTML issues, complex ARIA relationships, and dynamic keyboard accessibility states that require manual judgment and assistive technology testing.