Accessibility Compliance
WCAG 2.2 AA review van webpagina's: alt-tekst, contrastberekening, grafiek- en formulierpatronen
Getest · Werkt
Wat het doet
Zet een toegankelijkheidsverzoek om in een WCAG 2.2 AA-controle over markup: een POUR-checklist, een WIE/WAT/WAAR alt-tekst beslisboom, een toegankelijk grafiekpatroon met een gekoppelde datatabel, formuliervelden met aria-describedby en role="alert", prefers-reduced-motion afhandeling, en een uitvoerbare contrast-ratio functie. Activeert wanneer je vraagt om een site of template te auditen op WCAG-compliance, alt-tekst voor afbeeldingen te schrijven, een datavisualisatie of formulier schermlezer-bruikbaar te maken, of kleurcontrast te controleren. Inclusief checklists voor bijschriften en audiobeschrijvingen, Paul Tol kleurblinden-veilige paletten, een gepinde axe-core plus Playwright audit recept, en huidige Amerikaanse en EU wettelijke deadlines.
Testrapport
Gekloond naar een tijdelijke HOME (export HOME=$(mktemp -d)) en de skill-map gekopieerd; SKILL.md landde op ~/.claude/skills/accessibility-compliance/SKILL.md, frontmatter heeft name+description, en de body verwijst naar geen repo-bestanden (de drie "Related skills" bestaan allemaal in de boom; SKILL.md, dev-toolkit/README.md en plugin.json retourneerden allemaal HTTP 200). Taak: beoordeel een 30-regelig nieuwsartikel HTML-fragment (slechte alt-tekst, grafiek-als-PNG, ongelabeld e-mailveld, div-als-knop op 20x20px, autoplay video, a:focus{outline:none}, drie lage-contrastkleuren) en produceer een gefixeerde versie. Baseline (2.6KB, /private/tmp/claude-501/-Users-afin-Desktop-Skill-Agregator/94648f54-e301-46fc-afd8-b98858a51ecf/scratchpad/a11y_baseline.md) kreeg semantiek, labels en een echte knop, maar schreef "contrast looks too light, should be checked" en "only 20x20px, hard to hit"; de skill run (8.8KB, a11y_skill.md) citeerde WCAG 2.2 SC 2.5.8 met de 24x24 CSS-px drempel, en ik voerde daadwerkelijk de validate_contrast() van de skill uit om 2.79:1 / 3.14:1 / 3.12:1 FAIL en 6.29:1 / 6.54:1 PASS te krijgen voor de vervangingen. De skill-versie voegde ook de <details> datatabel plus aria-labelledby/describedby toe voor de grafiek (baseline schreef alleen een één-regelige alt), een prefers-reduced-motion blok en JS gate die baseline volledig miste, caption/description <track> elementen, en :focus-visible in plaats van baseline's botte :focus. Beveiligingsscan schoon: geen curl|sh, geen base64, geen geheimen, npm dep gepind op een exacte versie die ik bevestigde bestaat en de huidige nieuwste is op het npm register, en het bestand vertelt expliciet om axe te laden vanuit de lokale node_modules in plaats van een CDN. Docs één punt afgetrokken: beschrijving is journalistiek-geframed en noemt zichzelf "essential", en data-journalism in "Related skills" wordt geleverd in een andere plugin dan deze.
Getest op: 2026-07-31 · Claude Code 2.x (agent harness)
Installatie
git clone --depth 1 https://github.com/jamditis/claude-skills-journalism.git /tmp/accessibility-compliance-src mkdir -p ~/.claude/skills cp -R /tmp/accessibility-compliance-src/dev-toolkit/skills/accessibility-compliance ~/.claude/skills/accessibility-compliance # Single self-contained SKILL.md (20KB), no bundled scripts or reference files. # No dependencies needed for the review/markup guidance itself. # Optional, only for the automated-audit section of the skill: # npm install --save-dev --save-exact axe-core@4.12.1 && npm ci # pip install playwright && playwright install chromium # Plugin-marketplace alternative: the repo ships .claude-plugin/marketplace.json and the # skill lives in the "dev-toolkit" plugin, which also bundles 9 other dev skills.
Commando's en voorbeeldprompts
/accessibility-complianceWCAG 2.2 AA review van webpagina's: alt-tekst, contrastberekening, grafiek- en formulierpatronen
Skills reageren op gewone verzoeken — geen commando's om te onthouden. Na installatie activeren prompts zoals deze de skill (in het Engels):
Audit this news site for WCAG complianceWrite alt text for these news imagesBuild an accessible data visualization for readers