Accessibility Compliance
WCAG 2.2 AA gjennomgang av websider: alt-tekst, kontrastmatematikk, diagram- og skjemamønstre
Bestått
Hva den gjør
Omgjør en tilgjengelighetsforespørsel til en WCAG 2.2 AA-gjennomgang av markup: en POUR-sjekkliste, et WHO/WHAT/WHERE alt-tekst beslutningstre, et tilgjengelig diagrammønster med en lenket datatabell, skjemafelt med aria-describedby og role="alert", prefers-reduced-motion-håndtering, og en kjørbar kontrastforholdsfunksjon. Utløses når du ber om å revidere et nettsted eller en mal for WCAG-samsvar, skrive alt-tekst for bilder, gjøre en datavisualisering eller et skjema skjermleser-brukbart, eller sjekke fargekontrast. Inkluderer sjekklister for bildetekst og lydbeskrivelse, Paul Tol fargeblind-sikre paletter, en festet axe-core pluss Playwright revisjonsoppskrift, og gjeldende amerikanske og europeiske juridiske frister.
Testrapport
Klonet til en midlertidig HOME (export HOME=$(mktemp -d)) og kopierte ferdighetskatalogen; SKILL.md landet på ~/.claude/skills/accessibility-compliance/SKILL.md, frontmatter har name+description, og kroppen refererer ingen repo-filer (de tre "Related skills" eksisterer alle i treet; SKILL.md, dev-toolkit/README.md og plugin.json returnerte alle HTTP 200). Oppgave: gjennomgå et 30-linjers nyhetsartikkel HTML-fragment (dårlig alt-tekst, diagram-som-PNG, umerket e-postfelt, div-som-knapp på 20x20px, autoplay video, a:focus{outline:none}, tre lavkontrastfarger) og produsere en fikset versjon. Grunnlinjen (2.6KB, /private/tmp/claude-501/-Users-afin-Desktop-Skill-Agregator/94648f54-e301-46fc-afd8-b98858a51ecf/scratchpad/a11y_baseline.md) fikk semantikk, etiketter og en ekte knapp, men skrev "contrast looks too light, should be checked" og "only 20x20px, hard to hit"; ferdighetskjøringen (8.8KB, a11y_skill.md) siterte WCAG 2.2 SC 2.5.8 med 24x24 CSS-px terskelen, og jeg utførte faktisk ferdighetens validate_contrast() for å få 2.79:1 / 3.14:1 / 3.12:1 FAIL og 6.29:1 / 6.54:1 PASS for erstatningene. Ferdighetsversjonen la også til <details> datatabellen pluss aria-labelledby/describedby for diagrammet (grunnlinjen skrev bare en en-linjes alt), en prefers-reduced-motion-blokk og JS-gate som grunnlinjen helt savnet, caption/description <track>-elementer, og :focus-visible i stedet for grunnlinjens brutale :focus. Sikkerhetsskanning ren: ingen curl|sh, ingen base64, ingen hemmeligheter, npm dep festet til en eksakt versjon som jeg bekreftet eksisterer og er den nyeste på npm-registeret, og filen forteller deg eksplisitt å laste axe fra den lokale node_modules i stedet for en CDN. Dokumentasjonen trakk ett poeng: beskrivelsen er journalistisk innrammet og kaller seg "essential", og data-journalism i "Related skills" leveres i en annen plugin enn denne.
Testet på: 2026-07-31 · Claude Code 2.x (agent harness)
Installer
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.
Kommandoer og eksempelprompter
/accessibility-complianceWCAG 2.2 AA gjennomgang av websider: alt-tekst, kontrastmatematikk, diagram- og skjemamønstre
Skills utløses av vanlige forespørsler — ingen kommandoer å huske. Etter installasjonen aktiverer prompter som disse skillen (på engelsk):
Audit this news site for WCAG complianceWrite alt text for these news imagesBuild an accessible data visualization for readers