Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →thedaviddias/alt-text
Use when reviewing image assets, markup, and CDN or build transforms related to Provide meaningful alt text for images. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.
Passed 22 of 22 test cases with the skill, and 21 of 22 without it.
1 fixed21 passed either way0 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
This benchmark measured an earlier version of the skill.
A test case the skill fixed. Same model, same prompt, with and without the skill.
Could you scan through our React component templates in `src/components/` and audit all image tags for accessibility compliance? Give me a list of issues found across our components so we can track accessibility debt.
| Checked | Without skill | With skill |
|---|---|---|
| The response explicitly mentions WCAG 2.1 Success Criterion 1.1.1 or Non-text Content. | Passed | Passed |
| The response specifies that images containing text must reproduce that text verbatim in the alt attribute. | Missed | Passed |
| The response recommends providing a short alt text alongside aria-describedby or a visible caption for complex images like charts. | Missed | Passed |
| The response indicates that standalone linked images must describe the destination of the link rather than the visual artwork. | Missed | Passed |
The instructions your model reads when the skill loads.
Approximately 2.2 billion people worldwide have vision impairment. Screen readers read the alt attribute aloud—without meaningful alt text, users who are blind receive no information about image content. Missing alt text also fails WCAG 2.1 Success Criterion 1.1.1, which is a Level A (minimum) requirement. Search engines also rely on alt text to index image content.
<img> must have an alt attribute—omitting it entirely violates WCAG 2.1 SC 1.1.1alt="" so screen readers ignore themScan all elements in the codebase. Verify: 1) Every has an alt attribute (missing alt is an error). 2) Decorative images use alt="". 3) Informative images have descriptive text that conveys the image's meaning—not just its file name. 4) Images that are links describe the destination. 5) Images of text reproduce the text in alt. Flag any without alt, with alt matching the filename (e.g., alt="photo1.jpg"), or with generic values like alt="image" or alt="photo".
For each image missing or with poor alt text: 1) Informative images—describe what the image conveys, not just what it shows (e.g., alt="Bar chart showing 40% increase in sales Q3 2024" not alt="chart"). 2) Decorative images—add alt="" so screen readers skip them. 3) Linked images—describe the link destination (e.g., alt="Visit our Twitter profile"). 4) Images of text—copy the text verbatim into alt. 5) Complex images (charts, infographics)—provide a short alt plus a longer description via aria-describedby or a visible caption.
Explain WCAG 2.1 Success Criterion 1.1.1 Non-text Content: every image must have a text alternative. Screen readers announce the alt attribute aloud—without it, users who are blind or have low vision cannot understand the page. Bad alt text (like alt="image") is no better than no alt text. Decorative images must use alt="" explicitly so screen readers skip them entirely—omitting alt causes some screen readers to announce the filename.
Review image assets, markup, and delivery configuration related to Provide meaningful alt text for images. Flag exact files or components where format choice, sizing, or loading behavior violates the rule, and describe how to confirm the fix in DevTools.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/rules/images/alt-text
test cases passed, vs 21 / 22 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.