fixing-accessibility

Fix accessibility issues in web UI components across development and QA.

27|11|Updated Mar 18, 2022

Search Tags:#ui #accessibility #a11y #code-review #aria #keyboard-navigation #focus-management

Ready to run

npx skills add https://github.com/dkast/biztro --skill fixing-accessibility-dkast

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: fixing-accessibility
Source: https://github.com/dkast/biztro/tree/main/.github/skills/fixing-accessibility
Command: npx skills add https://github.com/dkast/biztro --skill fixing-accessibility-dkast

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Accessibility issues in UI components hinder usability; this skill provides structured guidance to fix them reliably.

Core Features & Use Cases

Audit interactive controls for accessible names and labeling
Ensure keyboard navigation, focus visibility, and proper focus management
Apply semantics and ARIA usage where appropriate to enhance accessibility
Use during code reviews, QA, and design handoffs to enforce accessibility

Quick Start

Apply the fixing-accessibility guidance to any UI work in this conversation.

Frequently Asked Questions about fixing-accessibility

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

FAQPage Schema

How do I fix accessibility issues in UI components during code review?▼

Fixing accessibility issues during code review involves auditing interactive controls for accessible names, ensuring keyboard navigation, verifying focus visibility, and applying proper ARIA semantics across web interfaces.

What's the best way to ensure keyboard navigation and focus management work in web dialogs?▼

Ensuring keyboard navigation and focus management in dialogs requires enforcing focus visibility, trapping focus within the component, and applying correct ARIA semantics to maintain accessible interaction patterns.

How do I audit interactive controls for accessible names and proper ARIA usage?▼

Auditing interactive controls for accessible names involves checking labeling compliance, validating ARIA attribute usage, and ensuring semantic HTML structure to enhance usability for assistive technologies.

Does this accessibility guidance apply to QA testing and design handoffs?▼

Yes, this accessibility guidance applies directly to QA testing and design handoffs, providing structured standards to enforce accessible names, keyboard navigation, focus management, and ARIA usage across UI components.

When do I need to apply ARIA semantics to fix a11y issues in forms?▼

You need to apply ARIA semantics to fix a11y issues in forms when native HTML elements lack the necessary semantics, requiring additional attributes to expose control names, roles, and states to assistive technologies.