a11y-semantics-pass

Audit UI code for accessibility and semantic deficiencies across components and routes.

1|Updated Jan 13, 2026
One-click install
npx skills add https://github.com/velcrafting/codex-skills --skill a11y-semantics-pass
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: a11y-semantics-pass
Source: https://github.com/velcrafting/codex-skills/tree/main/skills/frontend/a11y-semantics-pass
Command: npx skills add https://github.com/velcrafting/codex-skills --skill a11y-semantics-pass

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Improve semantics and accessibility coverage for UI changes (roles, labels, focus, keyboard, ARIA correctness). This skill ensures updates do not regress accessibility baselines and helps engineers address accessibility during frontend work.

Core Features & Use Cases

  • Semantic HTML audits to ensure correct element semantics and roles.
  • Labeling and naming checks to provide accessible names for interactive controls.
  • Keyboard navigation and focus management validation across dialogs, menus, and forms.
  • ARIA usage reviews and safe, minimal ARIA augmentation when necessary.
  • Use Case: Apply to a new UI component library migration to maintain accessibility parity with the previous version.

Quick Start

Audit the target UI for accessibility and semantic issues and implement fixes to meet baseline guidelines.

Frequently Asked Questions about a11y-semantics-pass

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

FAQPage Schema
How do I audit UI code for semantic HTML and ARIA accessibility issues?

To audit UI code for semantic HTML and ARIA accessibility issues, review component markup to verify correct element semantics, validate keyboard navigation, and ensure interactive controls have accessible names. This process identifies and fixes accessibility deficiencies across web app routes.

What is the best way to validate keyboard navigation and focus management in web apps?

Validating keyboard navigation and focus management in web apps requires testing operability across dialogs, menus, and forms. You must verify visible focus management and correct markup semantics to ensure interactive controls are fully accessible via keyboard input.

How do I maintain accessibility parity during a UI component library migration?

To maintain accessibility parity during a UI component library migration, audit the target UI to identify semantic and ARIA deficiencies. Apply fixes for keyboard operability, visible focus, and correct markup semantics to prevent regressing established accessibility baselines.

When do I need to apply safe minimal ARIA augmentation to interactive controls?

Safe, minimal ARIA augmentation is needed when semantic HTML audits reveal that interactive controls lack accessible names or correct roles. It should be applied only when necessary to provide accessible labeling and ensure proper ARIA usage across UI components.

Can I use this accessibility audit process for frontend changes and UI refactors?

Yes, you can use this accessibility audit process for frontend changes and UI refactors. It is designed to operate across web apps, dashboards, and forms, ensuring that updates do not regress accessibility baselines during component migrations.