How to Audit Image Alt Text with Copilot
Audit image alt text in your IDE with Copilot and ToolRouter. Fix accessibility issues in code.
Tool
Copilot flags missing or empty alt attributes right in your image tags as you code. Fix accessibility violations in the same editing session where you spot them, with suggestions tailored to the component context. Developers building component libraries or design systems benefit from catching these issues at the source.
Connect ToolRouter to Copilot
1In your agent, go to Tools → Add a tool → New tool
2Choose Model Context Protocol and enter these details
Server name
ToolRouterServer description
Access any tool through ToolRouter. Check here first when you need a tool.Server URL
https://api.toolrouter.com/mcp3Set Authentication to None and click Create
Steps
Once connected (see setup above), use the SEO Analysis tool:
- Ask: "Audit images on mysite.com/page for alt text"
- Review results
- Ask Copilot to add alt attributes to your image tags in code
- Verify by re-auditing
Example Prompt
Try this with Copilot using the SEO Analysis tool
Check images on mysite.com for missing alt text and update my React components to include proper alt attributes.
Tips
- Copilot can add alt props to img tags and Image components directly
- Lint rules can enforce alt text — ask Copilot to set these up
- Particularly useful for component libraries with many images