skills.rest
gagandeepgill
gagandeepgillCOMMUNITY
Explore all skills by this author →
GitHub

fixing-accessibility

Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, and focus management.

1|Updated Aug 31, 2026
Search Tags:#code review#html#accessibility#keyboard navigation#wcag#focus management#aria
One-click install
npx skills add https://github.com/gagandeepgill/puzzle-game --skill fixing-accessibility-gagandeepgill
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: fixing-accessibility
Source: https://github.com/gagandeepgill/puzzle-game/tree/main/.claude/skills/fixing-accessibility
Command: npx skills add https://github.com/gagandeepgill/puzzle-game --skill fixing-accessibility-gagandeepgill

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Interactive UI code often ships with accessibility defects—unlabeled icon buttons, keyboard-inaccessible controls, broken focus handling in dialogs, and unlinked form errors—that block screen reader and keyboard users and fail WCAG compliance reviews. ## Core Features & Use Cases - Prioritized Rule Audit: Reviews files against nine ranked rule categories, from accessible names and keyboard access (critical) to contrast, motion, and tool boundaries. - Targeted Fix Suggestions: Reports each violation with the exact offending snippet, a one-sentence rationale, and a minimal code-level fix rather than large rewrites. - Use Case: While adding a modal dialog with a form, apply the skill to verify focus trapping, Escape-to-close behavior, aria-describedby error linking, and aria-invalid states before shipping. ## Quick Start Ask the assistant to review a specific HTML or component file against the fixing-accessibility rules and report violations with concrete fixes.

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 HTML forms?▼

Link error messages to fields with aria-describedby, set aria-invalid on invalid inputs, mark required fields so they are announced, and associate helper text with inputs. The skill reviews these patterns and proposes minimal code-level fixes.

How do I make icon-only buttons accessible?▼

Add an aria-label or aria-labelledby to the button so it has an accessible name, and mark the inner SVG as aria-hidden="true" so screen readers skip the decorative graphic.

What accessibility issues should I check first in a code review?▼

Start with the critical categories: accessible names for all interactive controls, full keyboard access with visible focus, and correct focus trapping and restoration in dialogs. Then check semantics, form errors, and announcements.

Should I use ARIA roles or native HTML elements?▼

Prefer native elements like button, a, and input over role-based hacks. Only add ARIA when native semantics cannot solve the problem, and ensure required ARIA attributes accompany any role you use.

When should I not apply these accessibility fixes?▼

Avoid large UI rewrites, unrelated refactors, or migrating UI libraries unless requested. The skill enforces minimal, targeted changes and does not add ARIA where native semantics already work.

Related Skills

Explore More Software Engineering Skills→
DITEKmaxDITEKmax

fixing-accessibility

Audit HTML accessibility violations and provide minimal code-level fixes.

Community
Intermediate
MS33834MS33834

Accessibility Audit

Audit user interfaces for WCAG conformance gaps and accessibility barriers.

Community
Intermediate
bergsidebergside
2.3k

artistic

Standardize high-contrast artistic UI design tokens with WCAG 2.2 AA accessibility rules.

Official
Intermediate
Eng-susoEng-suso

wcag-audit-patterns

Audit web content against WCAG 2.2 criteria with automated scans and manual verification checklists.

Community
Intermediate