accessibility-compliance

Audit and fix UI components for WCAG 2.2 accessibility compliance.

Updated Mar 18, 2026
One-click install
npx skills add https://github.com/ekremmkasap/jarvis --skill accessibility-compliance-ekremmkasap
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: accessibility-compliance
Source: https://github.com/ekremmkasap/jarvis/tree/main/server/agent_prompts/wshobson/plugins/ui-design/skills/accessibility-compliance
Command: npx skills add https://github.com/ekremmkasap/jarvis --skill accessibility-compliance-ekremmkasap

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Implements WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, applying ARIA patterns, building for screen readers, or ensuring inclusive user experiences.

Core Features & Use Cases

  • WCAG 2.2 Guidelines and ARIA patterns (roles, states, and properties) to enable accessible components.
  • Keyboard navigation, focus management, and screen reader support across forms, modals, dialogs, and dynamic content.
  • Mobile accessibility considerations and accessibility audits to identify violations and nurture inclusive experiences.

Quick Start

Audit a UI component for WCAG 2.2 compliance and implement ARIA patterns and accessible keyboard support.

Frequently Asked Questions about accessibility-compliance

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

FAQPage Schema
How do I audit a UI component for WCAG 2.2 compliance?

To audit a UI component for WCAG 2.2 compliance, you evaluate it against established guidelines using ARIA patterns, keyboard navigation checks, and screen reader support validation across web and mobile interfaces to identify violations.

What are ARIA patterns and when do I need them for accessible forms?

ARIA patterns define roles, states, and properties for accessible components. You need them when building dynamic content or forms to ensure screen readers properly interpret UI states that standard HTML cannot convey.

How do I implement keyboard navigation and focus management in modals?

Implement keyboard navigation and focus management in modals by trapping focus within the dialog, providing logical tab order, and returning focus to the triggering element upon closure to ensure inclusive user experiences.

Does this approach support mobile accessibility and dynamic content?

Yes, this approach supports mobile accessibility and dynamic content by applying WCAG 2.2 guidelines, inclusive design patterns, and assistive technology support across both web and mobile interfaces to ensure compliance.

What is the best way to fix screen reader support violations in dynamic dialogs?

The best way to fix screen reader support violations in dynamic dialogs is to apply correct ARIA roles, states, and properties, ensuring focus management and keyboard navigation align with WCAG 2.2 accessibility standards.

Why does keyboard navigation fail in dynamic content after an audit?

Keyboard navigation fails in dynamic content when focus management is improperly applied. Remediate this by implementing proper ARIA patterns and ensuring focus shifts logically during dynamic UI updates to meet inclusive design standards.