← ClaudeAtlas

frontend-a11y-auditlisted

Audit an interface for accessibility — semantic structure, keyboard and focus, contrast, and responsive behavior — and return the corrected code. Use before shipping user-facing UI, when a component must meet WCAG, or when keyboard and screen-reader behavior is unverified.
10xequity/claude-skill-library · ★ 0 · Web & Frontend · score 54
Install: claude install-skill 10xequity/claude-skill-library
# Frontend Accessibility Audit Skill ## Purpose Audit an interface for semantic structure, keyboard and focus behavior, contrast, and responsive resilience, and return the fixes. ## When to use Use this skill before shipping user-facing UI, when a component must meet a WCAG target, or when keyboard and screen-reader behavior has never been verified. Use `web-design-guidelines.md` for the broader conformance sweep that also covers performance and theming; this skill goes deep on accessibility alone. ## Inputs - the pages or components under review - accessibility target, default WCAG 2.2 AA - assistive technologies that must be supported - known user-reported problems ## Output Return: - findings grouped as structure, keyboard and focus, contrast and colour, responsive and zoom, and assistive-technology naming - each finding with the element, the failing criterion, the user impact, and the corrected code - a pass/fail summary against the stated target - what could not be verified without manual or screen-reader testing, stated explicitly ## Constraints - **Structure** — one `<h1>`, headings in order with no skipped levels, landmarks (`main`, `nav`, `header`, `footer`), lists marked up as lists, tables with real headers - native semantics before ARIA; an ARIA role patching a `<div>` that should be a `<button>` is a finding, not a fix - **Keyboard** — every interactive element reachable, operable, and in a logical tab order; visible `:focus-visible` indicator; focus trapped