Skip to content
Get packs

Iframe Title Checker

Checks that iframes and frames have descriptive titles for screen reader users.

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

What it does

When installed, the agent reviews web page markup and components to confirm every iframe or frame has a non-empty, descriptive title attribute. Screen reader users rely on that title to understand embedded content such as ads or social widgets without entering it. The agent flags missing or vague titles and suggests better wording.

Great for

  • Front-end developers reviewing HTML before release
  • Accessibility reviewers auditing embedded third-party content
  • Designers checking component patterns that include embeds

Skip it if

  • Projects with no iframes or frames, since the rule would not apply
  • Replacing a full accessibility audit, because it only covers this one check and cannot test with real assistive technology

Try asking

  • “Review this page's HTML and check that every iframe has a descriptive title”
  • “Add accessible titles to the YouTube and map embeds in this component”
  • “Explain why my iframe title matters for screen reader users”
Step-by-step guide: how to use Iframe Title CheckerInstall, 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.

    frame-title.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip frame-title.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip frame-title.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 markup or component code directly so the agent can check the actual rendered attributes.
  • Ask for a specific fix, such as a title for a particular embed, to get concrete wording rather than generic advice.
  • Confirm the final result with a browser accessibility tool or a screen reader, since the agent works from code only.

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.