fixing-accessibility

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

Updated Mar 25, 2026
One-click install
npx skills add https://github.com/Shaarav4795/ScholarFlow --skill fixing-accessibility-shaarav4795
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: fixing-accessibility
Source: https://github.com/Shaarav4795/ScholarFlow/tree/main/.agents/skills/fixing-accessibility
Command: npx skills add https://github.com/Shaarav4795/ScholarFlow --skill fixing-accessibility-shaarav4795

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Accessibility issues in web interfaces degrade usability for all users, including keyboard and screen reader users, leading to poor WCAG compliance.

Core Features & Use Cases

  • ARIA guidance: Ensure controls have meaningful accessible names and proper aria attributes.
  • Keyboard and focus: Verify focus order, visible focus indicators, and trap focus in dialogs.
  • Conformance and testing: Identify color contrast problems, invalid markup, and form error messaging to improve inclusivity.
  • Use cases: When implementing or auditing interactive controls, forms, dialogs, or reviewing WCAG compliance across UI components.

Quick Start

Review the provided UI element and propose minimal, targeted accessibility 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 keyboard navigation and focus management issues in web UI components?

Fixing keyboard navigation requires verifying focus order, ensuring visible focus indicators, and trapping focus within dialogs. This guarantees interactive controls are fully keyboard accessible and meet WCAG compliance standards.

How do I add proper ARIA attributes and accessible names to interactive HTML elements?

Adding proper ARIA attributes involves applying meaningful accessible names and correct semantic roles to interactive controls. This ensures screen readers accurately announce UI elements, improving overall inclusivity and WCAG conformance.

What is the best way to audit WCAG compliance and color contrast across web interfaces?

Auditing WCAG compliance involves reviewing interactive controls, forms, and dialogs to identify color contrast problems and invalid markup. This process highlights accessibility gaps to improve inclusivity and usability for all users.

How do I implement accessible form errors and validation messaging for screen readers?

Implementing accessible form errors requires associating validation messages with input fields using proper ARIA attributes. This ensures screen reader users receive clear error messaging, improving form usability and WCAG compliance.

Can I use this approach to review accessibility on existing UI components without rewriting HTML?

Yes, you can review existing UI components and apply minimal, targeted accessibility fixes. By auditing semantic markup and adding proper ARIA attributes, you improve inclusivity without needing a complete HTML rewrite.