본문으로 건너뛰기
cccskills
무료GitHub에 공개

a11y-check

Accessibility audit, scoped to the surfaces a product actually has. Detects web / rendered_markdown / terminal / native_app / video_audio / document / headless, then applies only the criteria that bind. WCAG 2.1 AA in full for web; not at all for headless.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(1)

  • SKILL.md7.1 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Accessibility Audit

Evaluate user-facing work against the criteria that BIND TO ITS SURFACES. Accessibility is a design constraint, not a polish step (Downe Principle 11) — and an instrument aimed at a surface the product does not have measures nothing while looking like a failure.

STEP 1 — SURFACE GATE. Run this BEFORE the checklist, every time.

The checklist below is written for web pages. Most products are not web pages. Detect which user-facing surfaces this product actually has, from the repository, and evaluate ONLY the criteria that bind to them. Profiles and detection hints: engine/canvas-guidance.yml#surfaces — web · rendered_markdown · terminal · native_app · video_audio · document · headless. A product commonly has several. State which you found and how, in the output.

THE RULE THAT DECIDES EVERY RATING:

situationrating
the surface is ABSENTn/a — and say which surface is missing
the surface is PRESENT and you measured itpass / partial / fail on the evidence
the surface is PRESENT and you did NOT measure itnot-assessed — a real gap, it could have been measured

MARKING A CRITERION fail BECAUSE ITS SURFACE DOES NOT EXIST IS A CATEGORY ERROR. It manufactures a defect out of a product's shape, and a done-bar built on it fails for a reason no work can fix.

MEASURED, WHICH IS WHY THIS SECTION EXISTS. On 2026-09-03 this skill's checklist was applied to Mycelium — a terminal product with markdown docs — and Downe principle 11 was rated fail, with the entry stating plainly: "NOT TESTED, which is this principle's own fail criterion... WCAG 2.1 AA is largely the wrong instrument for a terminal product." A delivery bar failed on an instrument that could not bind. Re-run 2026-09-04 under the surface gate: every applicable criterion passed, and the rest were n/a by absence of surface rather than unmeasured.

THREE CONSTRAINTS, OR THIS GATE BECOMES A WAIVER MACHINE. Declaring a surface costs work; declaring its absence costs a word, and accessibility has a long history of being waived on exactly such grounds.

  1. Detect from artifacts and RECORD THE EVIDENCE — say what you looked for and where. An n/a whose basis is "the agent decided" is not a finding and cannot be falsified later.
  2. n/a must never read as pass in a total. "6 pass / 3 n/a" is honest; "9 of 15 clear" is the thing this rule exists to stop.
  3. FLOOR: every shipped product has at least one human surface — its docs, at minimum. A fully-n/a accessibility result is a DETECTOR BUG, not a clean bill. Treat that run as broken.

AND SURFACES SCOPE THE SUB-CHECKS, NEVER THE PRINCIPLE. Downe P11 "Be usable by everyone" is broader than perceptual access: it covers cost, language, literacy, required prior knowledge and availability. A terminal product may be n/a on keyboard navigation and still FAIL P11 on jargon that gates a newcomer. Bind WCAG's sub-checks to surfaces; never hand the principle itself an n/a.

HEADLESS IS THE SHARP CASE. An API or library has no human surface, so WCAG does not bind at all. What binds instead — error-message clarity, documentation quality — lives under other Downe principles. Do not rate a headless product on interface criteria.

STEP 2 — WCAG 2.1 AA Checklist by Principle

Applies in full to web. Partially to rendered_markdown, native_app, document. Barely to terminal. Not at all to headless.

1. Perceivable

  • All images have meaningful alt text (or alt="" for decorative)
  • Video has captions; audio has transcripts
  • Color is never the sole indicator of meaning
  • Color contrast: 4.5:1 normal text, 3:1 large text
  • Content is readable at 200% zoom without horizontal scroll
  • Text spacing can be adjusted without loss of content

2. Operable

  • All interactive elements reachable via keyboard (Tab/Shift+Tab)
  • Visible focus indicators on all focusable elements
  • No keyboard traps (can always Tab away)
  • Skip navigation link for repetitive content
  • Page titles are descriptive and unique
  • Focus order matches visual order
  • Touch targets are at least 44x44 CSS pixels

3. Understandable

  • Language of page is declared (lang attribute)
  • Form inputs have associated labels
  • Error messages identify the field and describe the fix
  • Instructions don't rely solely on sensory characteristics
  • Navigation is consistent across pages

4. Robust

  • Valid HTML (no duplicate IDs, proper nesting)
  • ARIA used correctly (roles, states, properties)
  • Custom components expose name, role, value to assistive tech
  • Status messages use aria-live regions

Automated Testing Tools (by stack)

StackToolCommand
React/Webaxe-corenpx axe <url> or axe-core in tests
Any webLighthousenpx lighthouse <url> --only-categories=accessibility
Any webpa11ynpx pa11y <url>
CI/CDaxe-linterAdd to CI pipeline

Common Violations and Fixes

ViolationFix
Missing alt textAdd descriptive alt or alt="" for decorative
Low color contrastIncrease contrast ratio to 4.5:1 minimum
Missing form labelsAdd <label for="id"> or aria-label
No focus indicatorAdd :focus-visible styles, never outline: none
Non-semantic buttonsUse <button> not <div onclick>
Missing heading hierarchyUse h1-h6 in order, don't skip levels
Auto-playing mediaAdd pause/stop controls, respect prefers-reduced-motion

When to Run

  • During development: after every UI component
  • Before PR: full automated scan
  • Before release: manual screen reader test of critical journeys
  • After design changes: re-audit affected components

Sensitive Context Note

For products handling sensitive user contexts (health, finance, domestic violence, government services), also review trauma-informed design principles in ${CLAUDE_PLUGIN_ROOT}/domains/quality/CLAUDE.md. Source: Hussain (Chayn), built on SAMHSA's 6 Principles (2014).

Neurodiversity Considerations

For information-dense or learning-oriented products, supplement WCAG with the Neurodiversity Design System (neurodiversity.design, Soward). Its 8 principle categories with neurotype-to-UI-element matrix address cognitive accessibility needs that WCAG does not fully cover (e.g., font shapes for dyslexia, number formatting for dyscalculia, animation controls for ADHD).

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

adopt

무료

Bring Mycelium into a project that already has code. Detects that the repo predates the framework, asks before touching anything, then reads the codebase to draft what it CAN establish (delivery, solution shape) and — the actual point — names what it cannot (purpose, strategy, real user evidence). The output is a discovery backlog with a head start, never a filled canvas.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

haabe/mycelium472026년 10월 18일 업데이트

Design the smallest viable test to validate or invalidate a critical assumption. Based on Torres's assumption testing framework, organized by Gilad's AFTER model (Assessment → Fact-Finding → Tests → Experiments → Release Results).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

haabe/mycelium472026년 10월 18일 업데이트

Use before any research activity or significant decision. Reviews cognitive biases relevant to the current stage.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

haabe/mycelium472026년 10월 18일 업데이트

Use to evaluate whether current work aligns with Better Value Sooner Safer Happier. Run at diamond completion and periodically.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

haabe/mycelium472026년 10월 18일 업데이트

Lint canvas files for staleness, missing fields, inconsistent evidence types, and orphaned references. Run periodically or before major transitions.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

haabe/mycelium472026년 10월 18일 업데이트

Synchronize canvas state across team sessions via git. Ensures all team members see the same product knowledge.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

haabe/mycelium472026년 10월 18일 업데이트

haabe의 스킬 모두 보기

이 스킬의 문제 신고