Skip to content
Get packs

Empty Link Accessibility Fixer

Finds and fixes links that screen readers can't describe, such as empty or icon-only links.

Source Download skill
Repository
thedaviddias/Front-End-Checklist
Stars
74,632
Licence
MIT
Files
2 files

What it does

This skill teaches an AI agent a specific accessibility rule: every link on a web page should have readable text so screen reader users know where it goes. When you ask the agent to review HTML or components, it checks for empty anchor tags, icon-only links without labels, and broken link destinations, then suggests fixes such as adding descriptive text or an aria-label. It is a checklist-style review guide rather than a tool that changes files on its own.

Great for

  • Front-end developers reviewing markup for accessibility issues
  • Designers or QA staff checking icon-only navigation and buttons before release
  • Teams working through the Front-End Checklist accessibility rules

Skip it if

  • Automated site-wide accessibility audits, since the skill only reasons over code the agent is shown and runs no scanner (it has no tools listed in the files)
  • Full WCAG compliance sign-off, because it covers one narrow rule about link names and destinations

Try asking

  • “Review this navigation HTML for links that have no accessible name and suggest fixes.”
  • “My footer has icon-only social links. Add proper aria-labels describing each destination.”
  • “Check this component for empty anchor tags and broken href values.”
  • “What would a screen reader announce for these links, and how do I verify the fix?”
Step-by-step guide: how to use Empty Link Accessibility FixerInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the MIT licence and an attribution note.

    empty-links.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip empty-links.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip empty-links.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Paste the rendered markup or component code, not just a description, so the agent can check actual elements.
  • Ask for the fix plus a way to verify it with browser accessibility tools or a screen reader.
  • Read references/rule.md for framework-specific examples; the main SKILL.md is brief.

What's inside

  • references/rule.md
  • SKILL.md

Redistributed unmodified from thedaviddias/Front-End-Checklist under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.