OverviewHistoryStatsSecurity
npx skills add ...
Documentation
SKILL.md
npx skills add davila7/claude-code-templates --skill seo-optimizer
Search Engine Optimization specialist for content strategy, technical SEO, keyword research, and ranking improvements. Use when optimizing website content, improving search rankings, conducting keyword analysis, or implementing SEO best practices. Expert in on-page SEO, meta tags, schema markup, and Core Web Vitals.
npx skills add davila7/claude-code-templates --skill seo-optimizer
Comprehensive guidance for search engine optimization across content, technical implementation, and strategic planning to improve organic search visibility and rankings.
Use this skill when:
Primary Keyword Selection:
Keyword Research Process:
Content Optimization Formula:
Title Tag Optimization:
Best Practices:
Meta Description:
Header Structure:
URL Structure:
Image Optimization:
Best Practices:
E-E-A-T Principles (Experience, Expertise, Authoritativeness, Trust):
Content Structure for SEO:
Content Length Guidelines:
Schema Markup (Structured Data):
Common Schema Types:
Robots.txt Configuration:
XML Sitemap Structure:
Canonical Tags:
Largest Contentful Paint (LCP) - Target: < 2.5s
First Input Delay (FID) - Target: < 100ms
Cumulative Layout Shift (CLS) - Target: < 0.1
Page Speed Optimization:
Mobile-First Optimization:
Viewport Configuration:
Best Practices:
Example:
Before Publishing:
Structure:
Implementation:
Question-Based Content:
List-Based Content:
Table-Based Content:
| Framework | Performance | Learning Curve | Ecosystem |
|---|---|---|---|
| React | Excellent | Moderate | Extensive |
| Vue | Excellent | Easy | Growing |
| Angular | Good | Steep | Mature |
Google Business Profile Optimization:
Local Schema Markup:
Key Metrics to Track:
Tools:
When optimizing for SEO, prioritize user experience and value delivery. Search engines increasingly reward content that genuinely helps users and provides authoritative, trustworthy information.
<!-- Good: Compelling, includes keywords, call-to-action, 150-160 chars -->
<meta name="description" content="Master React Hooks with our comprehensive guide. Learn useState, useEffect, and custom hooks with practical examples. Start building better React apps today.">
<!-- Bad: Too short, no value proposition -->
<meta name="description" content="React Hooks guide and tutorial"><!-- Proper hierarchy -->
<h1>Main Page Title (Primary Keyword)</h1>
<h2>Section Heading (Related Keywords)</h2>
<h3>Subsection</h3>
<h3>Subsection</h3>
<h2>Another Section</h2>
<h3>Subsection</h3>✅ Good URLs:
- /blog/react-hooks-guide
- /products/running-shoes
- /learn/javascript-async-await
❌ Bad URLs:
- /blog?p=12345
- /products/cat-1/subcat-2/item-999
- /page.php?id=abc&ref=xyz<!-- Optimized image -->
<img
src="/images/react-hooks-diagram-800w.webp"
alt="React Hooks lifecycle diagram showing useState and useEffect"
width="800"
height="600"
loading="lazy"
/># Main Title (H1) - Primary Keyword
Brief introduction with primary keyword in first 100 words.
## What is [Topic]? (H2) - Answer core question
Comprehensive explanation with examples.
## Why [Topic] Matters (H2) - Value proposition
Benefits and use cases.
## How to [Action] (H2) - Practical guide
Step-by-step instructions with visuals.
## Best Practices (H2) - Advanced tips
Expert recommendations.
## Common Mistakes to Avoid (H2)
Troubleshooting and pitfalls.
## Conclusion
Summary and call-to-action.{
"@context": "https://schema.org",
"@type": "Article",
"headline": "Complete Guide to React Hooks",
"image": "https://example.com/images/react-hooks.jpg",
"datePublished": "2024-01-15",
"dateModified": "2024-02-01",
"author": {
"@type": "Person",
"name": "Jane Developer"
},
"publisher": {
"@type": "Organization",
"name": "Tech Academy",
"logo": {
"@type": "ImageObject",
"url": "https://example.com/logo.png"
}
}
}User-agent: *
Disallow: /admin/
Disallow: /private/
Disallow: /api/
Allow: /api/public/
Sitemap: https://example.com/sitemap.xml<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://example.com/</loc>
<lastmod>2024-01-15</lastmod>
<changefreq>weekly</changefreq>
<priority>1.0</priority>
</url>
<url>
<loc>https://example.com/blog/react-hooks-guide</loc>
<lastmod>2024-01-10</lastmod>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
</urlset><!-- Prevent duplicate content issues -->
<link rel="canonical" href="https://example.com/original-page">
<!-- Handle URL parameters -->
<link rel="canonical" href="https://example.com/products/shoes">
<!-- Even if accessed via: /products/shoes?color=red&size=10 --><!-- Preload critical resources -->
<link rel="preload" href="/fonts/main.woff2" as="font" crossorigin>
<!-- Defer non-critical CSS -->
<link rel="preload" href="/styles/non-critical.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<!-- Async/defer JavaScript -->
<script src="/js/analytics.js" async></script>
<script src="/js/main.js" defer></script><meta name="viewport" content="width=device-width, initial-scale=1">Learn more about [advanced React patterns](/guides/react-patterns)
or check out our [useState hook tutorial](/tutorials/usestate-guide).Pillar Page: "Complete Guide to React"
├── Cluster: "React Hooks Tutorial"
├── Cluster: "React Context API Guide"
├── Cluster: "React Performance Optimization"
└── Cluster: "React Testing Best Practices"## What is React?
React is a JavaScript library for building user interfaces,
developed by Facebook. It allows developers to create reusable
UI components and efficiently update the DOM through a virtual
DOM implementation.## Top 5 React Best Practices
1. Use functional components with hooks
2. Implement proper state management
3. Optimize performance with React.memo
4. Follow component composition patterns
5. Write comprehensive tests{
"@type": "LocalBusiness",
"name": "Tech Solutions Inc",
"address": {
"@type": "PostalAddress",
"streetAddress": "123 Main St",
"addressLocality": "San Francisco",
"addressRegion": "CA",
"postalCode": "94102"
},
"telephone": "+1-415-555-0123"
}