Guide · Agent skill
How to use the Single Descriptive H1 Audit agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
The h1 skill is a set of checklist rules that teaches an AI agent to review the main heading of a web page. It covers missing H1 tags, multiple H1s, empty headings, and headings that only show the brand name. This guide explains what the skill does, how to install it, how to ask for it in plain language, and what to watch for before you act on its suggestions.
Single Descriptive H1 Auditthedaviddias/Front-End-Checklist · MIT Download the skill Quick start
- 1Download the ZIP. Get the h1 skill ZIP from this page.
- 2Unzip the skill. Extract the folder so it contains SKILL.md and references/rule.md.
- 3Place or upload the skill. Put the folder in ~/.claude/skills/ or a project's .claude/skills/, or upload it under Settings → Capabilities → Skills in the Claude apps.
- 4Paste the page HTML. Give the agent the rendered HTML or the template code for the page you want checked.
- 5Ask in plain language. Request an heading audit or an H1 rewrite, and include the page topic and target keyword.
- 6Review the suggestions. Check each proposed H1 against your brand and legal constraints before publishing.
What an agent skill is and what the h1 skill makes the agent do
An agent skill is a folder of instructions that an AI agent can load when a task matches the skill's description. The h1 skill's description says it applies when you are auditing a page's heading structure, generating H1 text for landing pages or blog posts, or reviewing a CMS template that may produce empty or missing H1 elements.
Its guidance is based on the Front-End Checklist SEO rule for H1 headings. The rule says each page should have exactly one H1 that describes the page's primary topic, and that the H1 should be visible in the rendered page.
- Flags pages with zero H1 tags or more than one H1 tag
- Flags H1 elements that are empty or contain only whitespace
- Flags H1s that contain only the brand name with no page-specific topic
- Flags H1 text that does not reflect the page's main content
- Suggests or writes a clearer H1 for a landing page or blog post
- Reviews CMS or React/Next.js templates that might output empty headings
Install the h1 skill from the ZIP or the Claude apps
Download the h1 skill as a ZIP from this page and unzip it. For personal use, place the unzipped skill folder in ~/.claude/skills/. For a single project, place it in that project's .claude/skills/ folder.
If you use the Claude apps, you can instead upload the skill under Settings → Capabilities → Skills.
- Personal install: ~/.claude/skills/
- Project install: .claude/skills/ inside your project
- Claude apps: Settings → Capabilities → Skills, then upload
Check what the skill needs before you start
The skill lists no required tools or packages. It does not run scripts and does not use the network. The package contains two files: SKILL.md, which holds the rules, and references/rule.md, which holds fuller examples and code patterns.
Because the skill runs no scripts and makes no network calls, it works only from what you give the agent: page code, rendered HTML, or template files. The agent cannot inspect a live site on its own through this skill.
- Requirements listed: none
- Runs scripts: no
- Uses network: no
- Files: SKILL.md and references/rule.md
Trigger the skill with natural requests
You do not need a special command. Describe the task in plain words that match the skill's purpose, and the agent can load the skill when it fits. Including the page, its topic, and the target keyword makes the result more useful.
The skill's checks work on the rendered DOM, so paste the rendered HTML of the page or describe the template where the heading is produced.
- Audit this page's heading structure: [paste HTML]
- Write an H1 for our landing page about invoicing software for freelancers. Target keyword: freelance invoicing
- Review this CMS template and tell me if it can output an empty H1
- Does this React page layout put the H1 in the shared header or in the page component?
Read the results and apply the fixes
The skill's fix steps ask for exactly one H1 per template, a specific topic rather than the site name, a natural inclusion of the primary keyword, and a visible H1. When several sections compete for the main heading, the skill suggests choosing one main topic and demoting the others to H2.
Check each suggested change against your brand and legal rules. The skill's own scope notes say it may propose changes that conflict with headings chosen for brand or legal reasons.
- Keep one H1 per page and demote other candidates to H2
- Make the H1 describe the page topic, not just the site name
- Confirm the H1 is not hidden with display:none or visibility:hidden
- In Next.js or React, keep the H1 in the page component, not the shared layout
<h1>Acme Corp</h1>
After: <h1>Project Management Software for Enterprise Teams</h1>Limits of the h1 skill
The skill covers only H1 structure. It does not review page content quality, page speed, or links. If you need a full SEO audit, use this skill alongside other checks.
The skill's guidance is a checklist drawn from the Front-End Checklist SEO page. It is not a substitute for testing your pages in search tools.
- Not for full SEO audits beyond headings
- Not for H1s fixed by brand or legal rules without review
What people use it for
- Auditing a landing page to confirm it has exactly one H1 that names the product
- Finding a CMS template that outputs an empty H1 for blog posts
- Writing an H1 for a new blog post that matches its title and target keyword
- Checking a Next.js page component to confirm the H1 is not in the shared layout
Frequently asked questions
Is the h1 skill free?
The source lists the skill under the MIT licence. The page does not list any price, so check the repository for the licence terms that apply to your use.
What do I need to install the h1 skill?
The skill lists no required tools, runs no scripts, and uses no network. You need the skill folder and an agent that supports skills, such as the Claude apps or Claude Code.
Where do I put the h1 skill folder?
Place it in ~/.claude/skills/ for personal use or in .claude/skills/ inside a project. In the Claude apps, upload it under Settings → Capabilities → Skills.
Can the h1 skill check a live website by itself?
No. The skill runs no scripts and uses no network, so it works from the HTML or template code you provide.
Does the h1 skill check more than headings?
No. It covers only H1 structure. It does not check content quality, page speed, or links, so use other tools for those.
Should the H1 match the title tag exactly?
No. The guidance says the H1 does not need to be identical to the title tag, but the two should be topically consistent.
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
Use the h1 skill if you are a website owner, marketer, front-end developer, or writer who wants a quick, rule-based check of H1 structure and help writing clearer main headings. Pick a different tool if you need a full SEO audit covering content, speed, and links, or if your H1 wording is fixed by brand or legal rules.
Download the skill