skills.rest
ryan-nguyen-01
ryan-nguyen-01COMMUNITY
Explore all skills by this author →
GitHub

skill-ui-accessibility

Analyze web UI structure, semantics, and ARIA usage for accessibility gaps.

4|Updated Mar 31, 2026
Search Tags:#accessibility#a11y#wcag#screen-reader#color-contrast#aria#keyboard-navigation
One-click install
npx skills add https://github.com/ryan-nguyen-01/agent-platform --skill skill-ui-accessibility
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: skill-ui-accessibility
Source: https://github.com/ryan-nguyen-01/agent-platform/tree/main/.claude/skills/skill-ui-accessibility
Command: npx skills add https://github.com/ryan-nguyen-01/agent-platform --skill skill-ui-accessibility

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Accessibility is often overlooked, leading to interfaces that are unusable by people with disabilities. This Skill provides practical guidance to implement WCAG 2.2 compliant patterns, ARIA usage, keyboard navigation, screen reader support, and color contrast considerations.

Core Features & Use Cases

  • WCAG-compliant UI patterns and semantic HTML guidance.
  • ARIA best practices, landmark roles, and accessible component patterns.
  • Use cases include auditing existing apps, building accessible components, and training teams.

Quick Start

Ask me to generate an accessibility-compliance checklist for your project.

Frequently Asked Questions about skill-ui-accessibility

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

FAQPage Schema
How do I audit my web app for WCAG 2.2 compliance?▼

To audit web app WCAG compliance, analyze semantic HTML structure, ARIA roles, and color contrast ratios to identify accessibility gaps. This process evaluates keyboard navigation and screen reader support to generate actionable remediation steps.

What is the best way to implement accessible ARIA landmark roles?▼

Accessible ARIA landmark roles require proper semantic HTML foundations combined with ARIA best practices. Evaluate your component patterns to ensure screen readers correctly interpret navigation, main content, and complementary regions.

How do I fix keyboard navigation and focus management issues?▼

Fix keyboard navigation issues by analyzing focus management and ARIA usage within your UI structure. Verify that interactive components are reachable and operate logically without requiring a pointing device.

Does this accessibility auditing work for component libraries?▼

Yes, accessibility auditing works for web apps and component libraries across HTML, CSS, and JS. It verifies keyboard navigation, color contrast, and screen reader support to ensure components meet WCAG standards.

Can I generate an accessibility checklist for my project?▼

Yes, you can generate a practical accessibility-compliance checklist tailored to your project. This checklist provides guidance on WCAG-compliant UI patterns, semantic HTML, and ARIA usage to guide implementation.

Related Skills

Explore More Design & Creative Skills→
JaivishChauhanJaivishChauhan
6

accessibility

Apply WCAG-compliant semantics to portfolio pages for keyboard and screen reader accessibility.

Community
Intermediate
esneiderbravoesneiderbravo
1

accessibility-standards

Audit UI accessibility for WCAG 2.2 AA compliance with automated and manual checks.

Community
Intermediate
nateanatea

accessibility-testing

Automates WCAG 2.2 accessibility checks for web and mobile interfaces via axe-core and CI/CD integration.

Community
Advanced
JhabbigJhabbig

wcag-audit-patterns

Audit web interfaces for WCAG 2.2 accessibility violations.

Community
Advanced