Guide · Agent skill
How to use the Avoid Redundant Image Alt Text agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
This guide explains how to use the image-redundant-alt agent skill, a small set of instructions that teaches an AI agent to check image alt text for wording that adds nothing, such as 'image of' or 'photo of'. It is written for people who have never used agent skills before. By the end you will know what the skill does, how to install it, how to ask for it in plain language, and what to expect from its suggestions.
Avoid Redundant Image Alt Textthedaviddias/Front-End-Checklist · MIT Download the skill Quick start
- 1Download the ZIP. Download the skill's ZIP from the page where you found this guide.
- 2Unzip the skill folder. Extract the ZIP so the folder contains SKILL.md and references/rule.md.
- 3Place it in the skills folder. Move the folder into ~/.claude/skills/ for personal use or into a project's .claude/skills/ folder.
- 4Or upload it in the apps. In the Claude apps, go to Settings → Capabilities → Skills and upload the skill.
- 5Ask for an alt text review. Point the agent at your HTML or component and ask it to check alt text for redundant wording.
- 6Apply and verify the changes. Review each suggested edit, then check the result with browser accessibility tooling or assistive technology.
What the skill makes the agent do
The skill covers one accessibility rule: avoid redundant image alternative text. Redundant alt text makes screen reader users hear extra words without gaining any information, which slows navigation and gives a poorer experience.
When installed, the agent scans image alt attributes for filler phrases like 'image of', 'picture of' and 'photo of', and for alt text that duplicates the words surrounding the image. It then suggests removing the redundant part so the remaining text describes the image's meaning.
- Flags phrases such as 'image of', 'picture of' and 'photo of' in alt attributes
- Flags alt text that exactly matches adjacent text, such as a caption
- Suggests removing the redundancy and keeping the alt text concise
- Explains why screen readers already announce that something is an image or graphic
- Reviews related issues in the markup: keyboard behaviour, focus flow and accessible names
Install the skill from the ZIP download
Download the ZIP for this skill from the page where you found this guide. Unzip it so that the skill folder, containing SKILL.md and references/rule.md, ends up inside one of the following locations.
For a personal setup available across your projects, place it in ~/.claude/skills/. For a single project, place it in that project's .claude/skills/ folder.
You can also upload the skill in the Claude apps under Settings → Capabilities → Skills.
- Personal: ~/.claude/skills/
- Project only: .claude/skills/ inside your project folder
- Claude apps: Settings → Capabilities → Skills, then upload
Trigger the skill with natural requests
You do not need a special command. The skill's description tells the agent when to use it, so ask for an alt text or accessibility review in ordinary language. Pointing the agent at the HTML file or component you care about helps it find the right images.
The description mentions reviewing rendered HTML, interactive components and design-system patterns, so requests about those work well.
- Review the alt text in index.html and remove any redundant wording.
- Check the image alt attributes in this component for 'image of' or 'photo of'.
- Look at our product cards and tell me if the alt text repeats the captions.
- Does this markup have redundant alt text? Explain why screen readers don't need it.
See what a fix looks like
The rule's reference page shows the typical problem and fix. Describing a photo of a dog as 'A photo of a Golden Retriever playing in the park' repeats the word 'photo', which screen readers already announce as an image. Where a caption already says the same thing, the alt text should not repeat it either.
In the corrected version, the alt text states only what the image shows. If the image is decorative or already described by a caption, the reference suggests relying on that context instead of repeating it.
<img src="dog.jpg" alt="Golden Retriever playing in the park">What the skill needs and what it does not do
The skill lists no required tools or prerequisites. It does not run scripts and does not use the network, so it works by reading the files you give it and suggesting changes.
Use it for simple, everyday alt text. It is a beginner-level checklist item, so it is not suited to charts, diagrams or decorative images, which need human judgement. It covers one narrow rule and does not replace a full accessibility audit or testing with real assistive technology.
- Requires: nothing listed
- Runs scripts: no
- Uses network: no
- Not for charts, diagrams or decorative images without human review
- Not a replacement for a full audit or testing with screen readers
Tips for getting useful results
Give the agent the markup itself, or the file path, rather than a description of the page. Ask it to explain its suggestions if you are learning the rule, since the explanations are part of what the skill provides.
Check every suggested change yourself. Alt text is about meaning in context, so the agent's wording may need adjusting for your content.
- Include the surrounding text or caption so the agent can spot duplication.
- Ask for the reason behind each change when you are learning.
- Verify the fixed markup with browser accessibility tooling or assistive technology.
What people use it for
- Cleaning up alt text across a website before an accessibility pass
- Reviewing a component library's image markup for repeated caption wording
- Giving content editors quick feedback on alt text they write
- Teaching a team the basic rule through concrete before-and-after examples
Frequently asked questions
How do I install the image-redundant-alt skill?
Download the ZIP from the page where you found this guide and unzip it. Place the folder in ~/.claude/skills/ for personal use or in a project's .claude/skills/ folder, or upload it in the Claude apps under Settings → Capabilities → Skills.
Is the image-redundant-alt skill free to use?
The skill is published under the MIT licence, as listed on this page. Check the licence file in the source repository for the full terms before reusing it.
What does the skill need to run?
The skill lists no required prerequisites. It does not run scripts and does not use the network, so it works by reading the files you provide.
Why does the skill say 'image of' is unnecessary in alt text?
Screen readers already announce that an element is an image or graphic. Words like 'image of' or 'photo of' repeat that information and add extra verbosity without adding meaning.
Can this skill check whether my alt text is good enough for charts or diagrams?
Not reliably. The skill is a beginner-level checklist item for one narrow rule, and complex images such as charts, diagrams and decorative images need human judgement.
Does this replace a full accessibility audit?
No. It covers one rule and does not replace testing with real assistive technology. Use it as one step in a wider accessibility review.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
This skill suits front-end developers doing an accessibility pass, and designers or content editors who want quick feedback on alt text. It is a narrow, beginner-friendly check, so pick a full audit tool or human review for charts, diagrams, decorative images or a complete compliance review.
Download the skill