Reviews SEO including meta tags, semantic HTML, and Open Graph. Use when building public-facing pages, adding title/description tags, or optimizing for search engines.
"Good SEO is good UX. If search engines can't understand your page, users might not find it."
Activate this skill when:
<head> sections<header>, <main>, <nav>, <article>, <footer><!-- ❌ BAD: Multiple H1s confuse search engines -->
<h1>Welcome</h1>
<h1>Our Products</h1>
<h1>Contact Us</h1>
<!-- ✅ GOOD: One H1, logical hierarchy -->
<h1>Welcome to Our Store</h1>
<h2>Our Products</h2>
<h2>Contact Us</h2>
<!-- ❌ BAD: Empty or useless alt -->
<img src="hero.jpg" alt="">
<img src="team.jpg" alt="image">
<!-- ✅ GOOD: Descriptive alt text -->
<img src="hero.jpg" alt="Software engineer working at laptop">
<img src="team.jpg" alt="Our founding team of 5 engineers">
<!-- ❌ BAD: No semantic meaning -->
<div class="header">
<div class="nav">...</div>
</div>
<div class="content">...</div>
<div class="footer">...</div>
<!-- ✅ GOOD: Semantic HTML -->
<header>
<nav>...</nav>
</header>
<main>...</main>
<footer>...</footer>
<!-- ❌ BAD: Jumps from H1 to H4 -->
<h1>Page Title</h1>
<h4>Some Section</h4>
<!-- ✅ GOOD: Sequential hierarchy -->
<h1>Page Title</h1>
<h2>Main Section</h2>
<h3>Subsection</h3>
<!-- ❌ BAD: Not descriptive -->
<title>Home</title>
<title>Page</title>
<!-- ✅ GOOD: Descriptive with keywords -->
<title>Daniel Lamb - Full Stack Developer Portfolio</title>
<title>Contact Us | Acme Software Solutions</title>
Ask these instead of giving answers:
// Pattern: Metadata export
export const metadata = {
title: 'Page Title',
description: 'Page description',
// Your implementation will differ
};
// Pattern: Next Head
import Head from 'next/head';
<Head>
<title>Your title here</title>
<meta name="description" content="Your description" />
</Head>
<!-- In index.html or via react-helmet -->
<head>
<title>Title here</title>
<meta name="description" content="Description here">
</head>
| Flag | Question | |------|----------| | Missing title tag | "What will this page show in search results?" | | Multiple H1s | "Which heading is the main topic? Search engines are confused." | | No meta description | "How will Google summarize this page?" | | Empty alt text | "What if the image doesn't load? What info is lost?" | | All divs, no semantics | "Can a screen reader navigate this page?" | | Title over 60 chars | "This will be cut off in search results. Can you shorten it?" |
<!-- Minimum viable Open Graph -->
<meta property="og:title" content="Your Page Title">
<meta property="og:description" content="Your page description">
<meta property="og:image" content="https://yoursite.com/og-image.jpg">
<meta property="og:url" content="https://yoursite.com/page">
<meta property="og:type" content="website">
"I implemented SEO best practices including semantic HTML, proper heading hierarchy, and meta tags, improving our page's discoverability."
When reviewing their code:
Fetch: Next.js metadata documentation
Fetch: Semantic HTML best practices
Search: "metadata" + "title" + "description" in Next.js repos
Search: Open Graph implementation patterns
npx skills add DanielPodolsky/seo-fundamentals下载完整 Skill 目录，包含 SKILL.md 及所有相关文件
Search for places (restaurants, cafes, etc.) via Google Places API proxy on localhost.
Interact with GitHub using the `gh` CLI. Use `gh issue`, `gh pr`, `gh run`, and `gh api` for issues, PRs, CI runs, and advanced queries.
Create or update AgentSkills. Use when designing, structuring, or packaging skills with scripts, references, and assets.
Start voice calls via the OpenClaw voice-call plugin.
Notion API for creating and managing pages, databases, and blocks.
Gemini CLI for one-shot Q&A, summaries, and generation.
Category:developer