better-accessibility

SKILL.md

Accessibility

This skill reviews and fixes semantics, keyboard and focus behavior, accessible names, forms, announcements, motion and zoom. It reports each failure against the WCAG criterion it breaks and writes the fix in the project's styling system.

Reviewing means two walks. Keyboard-only, where every flow completes without a mouse. Then screen-reader, where every control announces a name, a role and its state. When unsure, take the platform default over a custom rebuild, and remove ARIA rather than add it.

Contrast measurement and color fixes belong to better-colors. Text sizing, iOS input zoom and language metadata belong to better-typography. Spacing between targets and spatial RTL belong to better-layout. Label, error and alt-text wording belong to better-writing. Animation recipes, hover styling and scroll containment belong to better-ui.

Criteria, not conventions

A finding cites a WCAG 2.2 Level A or AA criterion by number, or a concrete task an assistive-technology user cannot complete. Everything else is a recommendation and never HIGH. That covers AAA criteria, APG conventions, the one-<h1> and no-skipped-levels outline and the 44px and 40px targets. The criterion thresholds below are exact. The larger targets are heuristics, so keep an established, usable density.

Native elements first

The first rule of ARIA: don't use ARIA when a native element exists. <button> for actions, <a href> for navigation, never <div onClick>. A real link must support Cmd/Ctrl/middle-click. See semantics-and-aria.md for landmarks and button-vs-link.

Disabled means unavailable

Use native disabled when a control is genuinely unavailable. Reach for aria-disabled="true" only when it should stay focusable, then block pointer, keyboard and form behavior in code and style the state explicitly. The rules are in semantics-and-aria.md.