{"slug":"accessibility-review","name":"Accessibility Review: WCAG Defects in Markup","version":"1.0.0","updated_at":"2026-10-08T05:37:31.901Z","use_when":"Reviews pasted HTML or JSX for the accessibility defects a screen reader or keyboard user hits first, and names the WCAG 2.2 success criterion for each. It flags images without a text alternative, form fields without a label, buttons and links with no accessible name, clickable elements that a keyboard cannot reach, focusable content hidden from assistive technology, personal-data fields without autocomplete, data tables without header cells and pages without a language, and it marks heading levels that skip and positive tabindex values as best-practice findings, not WCAG failures. Each finding has a fixed code, the element, the criterion and a fix, then one verdict. Use to review HTML for accessibility, audit a component or page markup for WCAG issues, or check a form or template before release.","not_for":"A full accessibility audit or a legal compliance report. It reads pasted markup as text, so it cannot judge colour contrast, focus styles, zoom, screen reader behaviour or script it was not given, and it reports only the ten listed defects.","languages":["any"],"tags":["accessibility","wcag","a11y","html","jsx","code-review"],"category":"code","category_url":"https://aiskills402.com/categories/code","keywords":["review HTML for accessibility","WCAG issues","check a form"],"faq":[{"q":"Which defects does it look for?","a":"Ten you can see in markup: images with no text alternative or a file name as alt, fields with only a placeholder, buttons and links with no accessible name, clickable divs a keyboard cannot reach, focusable content inside aria-hidden, personal-data fields with no autocomplete, data tables with no header cells, a page with no language, skipped heading levels and positive tabindex. Each finding names the WCAG 2.2 criterion, or says best practice where no criterion fails."},{"q":"Do I need it if my model already knows accessibility?","a":"For finding defects, probably not: in our test Sonnet and Haiku found every planted defect without the skill too. What the skill gives you is the shape of the answer: one coded line per defect and a verdict a script can act on, about 90 output tokens from Sonnet instead of about 1,000, and no should-fix advice on markup that is correct."},{"q":"Does it replace an automated checker such as axe?","a":"No, and a checker does not replace it either. On our test markup an automated engine confirmed nine of thirteen planted defects; the four it missed (a file name as alt, a clickable div, a table without header cells, missing autocomplete) are ones engines usually miss. Run both, and test with a keyboard and a screen reader before release."},{"q":"Will a comment in the markup change the result?","a":"No. The skill treats the markup as data. In our test a comment telling the reviewer to report no findings sat above an icon button with no name, and both models still reported the button."}],"examples":[{"lang":"en","model":"claude-sonnet-5-5","input_excerpt":"<article>\n  <h2>Our new office</h2>\n  <img src=\"/img/office-front.jpg\">\n  <p>We moved to the old printing house on Market Street.</p>\n</article>","output_excerpt":"[IMG-ALT] img src=\"/img/office-front.jpg\": no alt attribute, so a screen reader may announce the file name or skip the image (1.1.1 Non-text Content). Fix: add a short description such as alt=\"Front of the old printing house on Market Street\", or alt=\"\" if the image is purely decorative.\nVerdict: blocks some users"}],"page_url":"https://aiskills402.com/skills/accessibility-review","markdown_url":"https://aiskills402.com/skills/accessibility-review.md","image_url":"https://cdn.aiskills402.com/og/skills/accessibility-review/afab4cc7.png","related_url":"https://api.aiskills402.com/v1/skills/accessibility-review/related","purchases_count":null,"tested":{"date":"2026-10-08","strong":{"model":"claude-sonnet-5-5 (Claude Code alias \"sonnet\")","verdict":"Named every planted defect with the right code and verdict: an image with no alt and one whose alt is a file name, a search field with only a placeholder, an icon-only button and an icon-only link, a clickable div, a link inside aria-hidden, a table with no header cells, a page with no language, a skipped heading level, positive tabindex, name and phone fields with no autocomplete, two defects in one JSX component, and an icon button under a comment telling the reviewer to report nothing. It reported nothing on five correct snippets, among them a decorative image with an empty alt, a search field named by aria-label and a div built as a keyboard-operable button."},"weak":{"model":"claude-haiku-5-5 (Claude Code alias \"haiku\")","verdict":"The same result: every planted defect with the right code and verdict, and nothing reported on the five correct snippets."},"note":"Nineteen short snippets written by us: fourteen with a planted defect and five correct ones built to tempt a false alarm. The check requires each expected code and the verdict and forbids every other code. An automated engine (AccessLint) run on the same HTML confirmed nine of the thirteen planted HTML defects and found nothing in the five correct snippets; the four it does not flag (an alt that is a file name, a clickable div, a table without header cells, missing autocomplete) are documented W3C failures that automated engines usually miss. The autocomplete code was added after the first run: without the skill both models pointed out that an email field had no autocomplete, a real AA failure our first version called clean, so the skill gained the code and the whole test was run again. One run per model and case. The skill covers ten defects you can see in markup; it does not judge contrast, focus styles or behaviour it cannot see, and it is not a full audit.","baseline":{"date":"2026-10-08","rows":[{"label":"Planted defects named (14 snippets)","better":"higher","strong":{"with":{"n":14,"of":14},"without":{"n":14,"of":14}},"weak":{"with":{"n":14,"of":14},"without":{"n":14,"of":14}}}],"note":"One run per model and snippet, the same word-based check on both sides. Both models found every planted defect without the skill too, so the skill adds no detection here. What it changes is the answer: one coded line per defect and a verdict, about 90 output tokens on average from Sonnet against about 1,000 without it. Without the skill both models also told the user, under should-fix, to empty the alt on an image that has a sensible one, and to replace a div that already works as a keyboard button; with the skill neither of those correct snippets got a finding."},"report_url":null},"price_usd":"0.03","price_micro":30000,"size_bytes":6937,"sha256":"11e6f3446f972a285f4c3075259bf2f6c6081212f5b7a2f2697a8c09640323ad","outline":["The answer","The codes","Rules","Work in this order","Short example"],"license":{"summary":"Perpetual, non-exclusive; use and modify for yourself incl. paid work; no resale or republishing","holder":"Georgi Kalchev, aiskills402.com","url":"https://aiskills402.com/docs#license"},"buy_url":"https://api.aiskills402.com/v1/skills/accessibility-review/file","redownload_url_template":"https://api.aiskills402.com/v1/purchases/{token}","mcp_tool":null,"payment":{"protocol":"x402","scheme":"exact","asset":"USDC","selling":true,"network":"base","network_caip2":"eip155:8453","pay_to":"0x8e37022edcf0f21cf3c9f93fee9d4d32519f36f4","facilitator":"cdp"},"seo_title":"Accessibility Review Skill for HTML and JSX","seo_description":"Skill file that reviews pasted HTML or JSX for ten accessibility defects, naming the WCAG 2.2 criterion and a fix for each. $0.03 once.","versions":[{"version":"1.0.0","date":"2026-10-08","changelog":"# Changelog\n\n## 1.0.0 — 2026-10-08\n\nFirst release: reviews pasted HTML or JSX for accessibility and lists each defect with a fixed code, the element, the WCAG 2.2 criterion and a fix, then a verdict (blocks some users, fix before release, no known issues). Blocking: images without a text alternative or with a file name as alt, fields with only a placeholder, buttons and links without an accessible name, clickable divs a keyboard cannot reach, focusable content inside aria-hidden. Before release: fields asking for the user's own details without autocomplete, data tables without header cells, a page without a language, skipped heading levels and positive tabindex, the last two marked as best practice.\n"}]}