메뉴
Reviews frontend changes for accessibility regressions across semantics, keyboard/focus behavior, forms, dynamic updates, styling, ARIA, and tests. Use for pull requests, diffs, audits, and pre-merge sign-off.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Builds accessible pages and components with semantic HTML, correct names/roles/states, keyboard support, focus management, links, images, SVG, media, and native controls first. Use when implementing or refactoring frontend UI.
Designs and reviews accessible forms, search, validation, errors, grouping, required state, multi-step flows, and recovery behavior. Use when implementing or auditing form-heavy UI.
Validates accessibility with automated checks, keyboard walkthroughs, screen reader smoke tests, zoom/preference checks, and focused regression reporting. Use when verifying new UI or confirming fixes.
Central routing and orchestration skill for web accessibility work. Use as the default entrypoint for accessibility-related UI tasks to select the right authoring, review, remediation, and testing workflows.
Reviews and writes CSS that preserves accessibility across contrast, focus styles, reduced motion, forced colors, zoom, target size, semantic integrity, and custom-styled controls. Use for UI styling and design-system changes.
Debugs accessibility issues with automated scanners, browser accessibility trees, keyboard checks, screen reader smoke tests, custom CSS/JS rules, and CI gates. Use when triaging barriers or building accessibility validation pipelines.
| name | web-a11y-review |
| description | Reviews frontend changes for accessibility regressions across semantics, keyboard/focus behavior, forms, dynamic updates, styling, ARIA, and tests. Use for pull requests, diffs, audits, and pre-merge sign-off. |
For strong finding examples, see FINDINGS.md.
Review checklist
- [ ] Semantic structure, landmarks, and headings support orientation
- [ ] Links, buttons, and custom controls expose correct role/name/state
- [ ] Images, SVG, media, downloads, and external/context-changing links are named and communicated correctly
- [ ] Keyboard operation is complete with visible focus
- [ ] Forms have labels, descriptions, grouping, errors, and recovery paths
- [ ] Dynamic updates are announced or focus-managed appropriately
- [ ] CSS preserves contrast, focus visibility, zoom, reduced motion, and semantics
- [ ] Tests include automation plus relevant manual smoke checks
Report findings first, ordered by severity:
<Severity> - <file/component>
Impact: <who is blocked or confused>
Fix: <smallest practical change>
Regression check: <test or manual step>