skills.rest
TheBoomerDev
TheBoomerDevCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-accessibility

Apply WCAG-compliant ARIA practices to improve UI accessibility.

Updated Aug 27, 2026
Search Tags:#accessibility#a11y#wcag#semantic-html#screen-reader#aria#keyboard-navigation
One-click install
npx skills add https://github.com/TheBoomerDev/feedback_proyect --skill web-accessibility-theboomerdev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-accessibility
Source: https://github.com/TheBoomerDev/feedback_proyect/tree/main/.agents/skills/web-accessibility
Command: npx skills add https://github.com/TheBoomerDev/feedback_proyect --skill web-accessibility-theboomerdev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams build accessible user interfaces that meet WCAG guidelines, reducing risk of accessibility violations and improving user experience for people with disabilities.

Core Features & Use Cases

  • ARIA & semantic HTML guidance: Ensures proper roles, labeling, and semantic structure across components.
  • Keyboard navigation & focus management: Supports tab order, trap focus in modals, and keyboard interactions.
  • Screen reader compatibility: Includes labeling, descriptions, and accessible text for screen readers.
  • WCAG audits & remediation: Provides guidelines and checklists to identify and fix contrast, headings, labeling, and navigation issues.
  • Use Case: Audit a multi-modal form to ensure all fields are correctly labeled and keyboard accessible.

Quick Start

Audit a UI component for accessibility and implement fixes to meet WCAG AA requirements.

Frequently Asked Questions about web-accessibility

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

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

To audit a UI component for WCAG compliance, you review semantic HTML, ARIA labeling, keyboard navigation, and color contrast. This Skill applies automated testing with axe-core to identify and fix accessibility issues to meet WCAG AA requirements.

How do I manage focus and keyboard navigation in a modal?▼

Managing focus in a modal requires trapping focus within the dialog and supporting tab order for keyboard interactions. This Skill provides ARIA practices to correctly label modals and handle focus management across React, Vue, Svelte, or vanilla JS interfaces.

What is the best way to add ARIA labels for screen reader compatibility?▼

Adding ARIA labels for screen reader compatibility involves applying proper ARIA roles, descriptions, and accessible text to UI components. This Skill guides you in applying WCAG-compliant ARIA practices to ensure screen readers can correctly interpret dynamic content and forms.

Does this accessibility Skill work with React, Vue, and Svelte?▼

Yes, this accessibility Skill works with React, Vue, Svelte, and vanilla JS. It applies WCAG-compliant ARIA practices and semantic HTML guidance across these frameworks to ensure screen reader compatibility and keyboard navigation for various UI components.

How do I fix color-contrast violations in an existing interface?▼

Fixing color-contrast violations requires checking your interface against WCAG AA contrast guidelines. This Skill provides audit checklists to identify contrast issues, improper headings, and missing labels, then applies remediation steps to resolve the accessibility violations.

Related Skills

Explore More Software Engineering Skills→
hospitaljobsinhospitaljobsin
7

frontend-design

Create production-grade frontend interfaces with React, Vue, Svelte, or vanilla HTML/CSS/JS.

Official
Advanced
fugazifugazi
215

a11y-playwright-testing

Automate WCAG 2.1 AA accessibility scans in Playwright tests with axe-core.

Community
Intermediate
thec3ukthec3uk

Frontend Accessibility

Guide frontend code to meet accessibility standards like ARIA and keyboard navigation.

Official
Basic
wredziowredzio

accessibility

Identify and remediate WCAG 2.1 AA accessibility issues in web pages.

Community
Advanced