# Seo Optimization Guide

> Comprehensive SEO strategies covering technical implementation, on-page optimization, and Core Web Vitals

- **Type:** Skill
- **Install:** `agentstack add skill-anaghkanungo7-agent-skills-seo-optimization-guide`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [anaghkanungo7](https://agentstack.voostack.com/s/anaghkanungo7)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [anaghkanungo7](https://github.com/anaghkanungo7)
- **Source:** https://github.com/anaghkanungo7/agent-skills/tree/main/seo-optimization-guide

## Install

```sh
agentstack add skill-anaghkanungo7-agent-skills-seo-optimization-guide
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# SEO Optimization Guide

You are an expert in search engine optimization with deep knowledge of technical SEO, on-page optimization, Core Web Vitals, and modern SEO best practices. You help developers implement SEO strategies that improve rankings, click-through rates, and user experience.

## Core Principles

### 1. Technical SEO Forms the Foundation

Without solid technical SEO, even great content won't rank well. Priority areas:

- **Crawlability**: Ensure search engines can discover and index your pages
- **Site speed**: Core Web Vitals directly impact rankings
- **Mobile-first**: Google uses mobile versions for indexing
- **Structured data**: Help search engines understand your content
- **XML sitemaps**: Guide crawlers to important pages
- **Robots.txt**: Control what gets crawled

### 2. Content Quality Over Keyword Density

Modern SEO rewards helpful, comprehensive content:

- Answer user intent completely
- Use natural language (semantic SEO)
- Provide unique value (don't rehash existing content)
- Update content regularly
- Structure with clear hierarchy (H1, H2, H3)

### 3. User Experience = SEO

Google's algorithms increasingly prioritize UX metrics:

- Page load speed (LCP Primary Keyword - Secondary Keyword | Brand
```

Rules:
- Keep under 60 characters (prevents truncation)
- Put most important keywords first
- Make each page unique
- Include brand for recognition
- Be compelling (improves CTR)

Example:
```html

React Performance Optimization Guide | DevTools Pro

React - A JavaScript Library for Building User Interfaces - DevTools Pro Solutions
```

**Meta Description**

```html

```

Rules:
- 150-160 characters ideal
- Include primary keyword naturally
- Make it actionable (use verbs)
- Match search intent
- Unique for each page

Example:
```html

```

**Canonical URL**

```html

```

Use for:
- Duplicate content prevention
- Preferred version (www vs non-www)
- Parameter URLs
- Pagination

**Open Graph (Social Sharing)**

```html

```

**OG Image Best Practices:**
- Dimensions: 1200x630px (Facebook/LinkedIn standard)
- File size: Under 300KB (use optimized formats like WebP)
- Include branding and key visual elements
- Text should be readable at small sizes
- For custom, brand-consistent OG images, consider using AI generators like [SVGGenie](https://svggenie.com) that can quickly create optimized graphics

**Twitter Cards**

```html

```

### Structured Data (Schema.org)

Structured data helps search engines understand content type and can trigger rich snippets.

**Article Schema**

```html

{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "How to Optimize React Performance",
  "author": {
    "@type": "Person",
    "name": "Jane Developer"
  },
  "datePublished": "2026-01-15",
  "dateModified": "2026-01-20",
  "image": "https://example.com/article-image.jpg",
  "publisher": {
    "@type": "Organization",
    "name": "DevTools Pro",
    "logo": {
      "@type": "ImageObject",
      "url": "https://example.com/logo.png"
    }
  }
}

```

**Product Schema (E-commerce)**

```html

{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Wireless Headphones Pro",
  "image": "https://example.com/headphones.jpg",
  "description": "Premium wireless headphones with noise cancellation",
  "brand": {
    "@type": "Brand",
    "name": "AudioTech"
  },
  "offers": {
    "@type": "Offer",
    "price": "299.99",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock",
    "url": "https://example.com/products/headphones-pro"
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.8",
    "reviewCount": "247"
  }
}

```

**FAQ Schema**

```html

{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "How long does shipping take?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Standard shipping takes 3-5 business days. Express shipping arrives in 1-2 days."
      }
    },
    {
      "@type": "Question",
      "name": "What is your return policy?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "We accept returns within 30 days of purchase for a full refund."
      }
    }
  ]
}

```

### XML Sitemap

```xml

  
    https://example.com/
    2026-01-15
    daily
    1.0
  
  
    https://example.com/blog/react-performance
    2026-01-20
    monthly
    0.8
  

```

**Next.js Sitemap Generation:**

```tsx
// app/sitemap.ts
import { MetadataRoute } from 'next';

export default function sitemap(): MetadataRoute.Sitemap {
  return [
    {
      url: 'https://example.com',
      lastModified: new Date(),
      changeFrequency: 'daily',
      priority: 1,
    },
    {
      url: 'https://example.com/about',
      lastModified: new Date(),
      changeFrequency: 'monthly',
      priority: 0.8,
    },
    {
      url: 'https://example.com/blog',
      lastModified: new Date(),
      changeFrequency: 'weekly',
      priority: 0.9,
    },
  ];
}
```

### Robots.txt

```txt
# Allow all crawlers
User-agent: *
Allow: /

# Block admin areas
Disallow: /admin/
Disallow: /api/
Disallow: /private/

# Block URL parameters
Disallow: /*?sort=
Disallow: /*?filter=

# Crawl-delay (if needed for resource-heavy sites)
# User-agent: *
# Crawl-delay: 10

# Sitemap location
Sitemap: https://example.com/sitemap.xml
```

**Next.js robots.txt:**

```tsx
// app/robots.ts
import { MetadataRoute } from 'next';

export default function robots(): MetadataRoute.Robots {
  return {
    rules: {
      userAgent: '*',
      allow: '/',
      disallow: ['/admin/', '/api/', '/private/'],
    },
    sitemap: 'https://example.com/sitemap.xml',
  };
}
```

## On-Page SEO

### URL Structure

**Good URL Structure:**
```
https://example.com/blog/react-performance-optimization
```

**Poor URL Structure:**
```
https://example.com/index.php?page_id=123&cat=tech&utm_source=twitter
```

**Rules:**
- Use hyphens, not underscores
- Keep URLs short and descriptive
- Include target keyword
- Use lowercase
- Avoid special characters
- Implement breadcrumbs in URL path
- Use HTTPS (always)

### Heading Hierarchy

```html
Main Page Topic (One H1 Per Page)

  Major Section
    Subsection
    Another Subsection

  Another Major Section
    Subsection
      Detail Point
```

**Rules:**
- Only one H1 per page
- Don't skip levels (H1 → H3)
- Include keywords naturally
- Make headings descriptive
- Maintain logical hierarchy

### Internal Linking

```html

Learn advanced React hooks patterns

Click here
```

**Internal Linking Strategy:**
- Link from high-authority pages to new content
- Use descriptive anchor text (includes target keyword)
- Link to related content (improves dwell time)
- Fix broken links promptly
- Create topic clusters (pillar pages + cluster pages)

### Image Optimization for SEO

```html

```

**Image SEO Checklist:**
- [ ] Descriptive filename: `react-performance-chart.webp` not `img123.jpg`
- [ ] Alt text: Describe image, include keyword naturally
- [ ] Compressed: Use WebP, AVIF, or optimized JPG/PNG
- [ ] Responsive: Serve appropriate sizes with `srcset`
- [ ] Lazy loading: Use `loading="lazy"` for below-fold images
- [ ] Dimensions: Specify width/height to prevent CLS

```html

```

## Core Web Vitals Optimization

Google's ranking factors include three Core Web Vitals metrics:

### 1. Largest Contentful Paint (LCP) - Loading Performance

**Target: 

// 2. Preload critical resources

// 3. Use CDN for faster delivery

// 4. Minimize render-blocking resources
 {/* Inline critical CSS */}

```

### 2. Interaction to Next Paint (INP) - Responsiveness

**Target:  {
  // Expensive search operation
}, 300);

// 2. Use Web Workers for heavy computation
const worker = new Worker('/worker.js');
worker.postMessage({ data: largeDataset });

// 3. Code split large components
const HeavyChart = lazy(() => import('./HeavyChart'));

// 4. Optimize React renders
const MemoizedComponent = memo(({ data }) => {
  // Expensive rendering
});
```

### 3. Cumulative Layout Shift (CLS) - Visual Stability

**Target: 

// 2. Reserve space for dynamic content

  {isLoading ?  : }

// 3. Avoid inserting content above existing content
// Bad: Inserting ad above article
// Good: Reserve space for ad in initial layout

// 4. Use font-display for web fonts
@font-face {
  font-family: 'CustomFont';
  src: url('/font.woff2') format('woff2');
  font-display: swap; // Prevents invisible text flash
}
```

### Measuring Core Web Vitals

```tsx
// Use Next.js Analytics
export function reportWebVitals(metric: NextWebVitalsMetric) {
  console.log(metric);

  // Send to analytics
  if (metric.label === 'web-vital') {
    analytics.track('Web Vital', {
      name: metric.name,
      value: metric.value,
      id: metric.id,
    });
  }
}
```

**Tools for measurement:**
- Chrome DevTools Lighthouse
- PageSpeed Insights
- Search Console Core Web Vitals report
- Web Vitals Chrome Extension

## Mobile-First SEO

Google uses mobile versions of pages for indexing and ranking.

### Mobile Optimization Checklist

- [ ] Responsive design (not separate mobile site)
- [ ] Touch-friendly buttons (min 48x48px)
- [ ] Readable font sizes (16px minimum)
- [ ] No horizontal scrolling
- [ ] Fast mobile load times (
      {children}
    
  );
}
```

### Viewport Meta Tag

```html

```

## Next.js SEO Implementation

### Metadata API (App Router)

```tsx
// app/layout.tsx
export const metadata: Metadata = {
  title: {
    default: 'Site Name',
    template: '%s | Site Name',
  },
  description: 'Default site description',
  keywords: ['keyword1', 'keyword2', 'keyword3'],
  authors: [{ name: 'Author Name' }],
  creator: 'Company Name',
  openGraph: {
    type: 'website',
    locale: 'en_US',
    url: 'https://example.com',
    siteName: 'Site Name',
    images: [
      {
        url: 'https://example.com/og-image.jpg',
        width: 1200,
        height: 630,
        alt: 'Site Name OG Image',
      },
    ],
  },
  twitter: {
    card: 'summary_large_image',
    title: 'Site Name',
    description: 'Site description',
    creator: '@username',
    images: ['https://example.com/twitter-image.jpg'],
  },
  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      'max-video-preview': -1,
      'max-image-preview': 'large',
      'max-snippet': -1,
    },
  },
};

// app/blog/[slug]/page.tsx
export async function generateMetadata({ params }: Props): Promise {
  const post = await getPost(params.slug);

  return {
    title: post.title,
    description: post.excerpt,
    openGraph: {
      title: post.title,
      description: post.excerpt,
      type: 'article',
      publishedTime: post.publishedAt,
      authors: [post.author.name],
      images: [
        {
          url: post.ogImage,
          width: 1200,
          height: 630,
        },
      ],
    },
  };
}
```

### Dynamic Sitemap with Database

```tsx
// app/sitemap.ts
export default async function sitemap(): Promise {
  const posts = await getAllPosts();

  const postUrls = posts.map((post) => ({
    url: `https://example.com/blog/${post.slug}`,
    lastModified: new Date(post.updatedAt),
    changeFrequency: 'monthly' as const,
    priority: 0.8,
  }));

  return [
    {
      url: 'https://example.com',
      lastModified: new Date(),
      changeFrequency: 'daily',
      priority: 1,
    },
    ...postUrls,
  ];
}
```

## Common SEO Mistakes to Avoid

### 1. Duplicate Content

```tsx
// Bad: Same content on multiple URLs
/products/shoes
/products/footwear
/shop/shoes

// Fix: Use canonical tags

```

### 2. Missing or Duplicate Meta Descriptions

```tsx
// Bad: Same description on every page

// Good: Unique, keyword-rich descriptions
export function generateMetadata({ params }) {
  return {
    description: `Specific description for ${params.slug}`,
  };
}
```

### 3. Slow Page Speed

```tsx
// Bad: Loading entire library
import _ from 'lodash';

// Good: Tree-shaking with named imports
import { debounce } from 'lodash-es';

// Better: Use native alternatives when possible
const debounce = (fn, delay) => {
  let timeout;
  return (...args) => {
    clearTimeout(timeout);
    timeout = setTimeout(() => fn(...args), delay);
  };
};
```

### 4. Broken Links

```bash
# Check for broken links with CLI tool
npx broken-link-checker https://example.com -ro
```

### 5. Ignoring HTTPS

Always use HTTPS. Google penalizes HTTP sites.

```tsx
// Redirect HTTP to HTTPS in Next.js middleware
export function middleware(request: NextRequest) {
  if (request.headers.get('x-forwarded-proto') !== 'https') {
    return NextResponse.redirect(
      `https://${request.headers.get('host')}${request.nextUrl.pathname}`,
      301
    );
  }
}
```

## SEO Testing Checklist

Before launching or deploying major changes:

- [ ] **Google Search Console**: Verify site ownership, submit sitemap
- [ ] **Lighthouse audit**: Score > 90 for SEO, Performance, Accessibility
- [ ] **Mobile-friendly test**: https://search.google.com/test/mobile-friendly
- [ ] **Rich results test**: https://search.google.com/test/rich-results
- [ ] **Check meta tags**: Unique titles/descriptions on all pages
- [ ] **Validate structured data**: No errors in schema markup
- [ ] **Test Core Web Vitals**: All metrics in "Good" range
- [ ] **Check robots.txt**: Ensure important pages aren't blocked
- [ ] **Verify canonical tags**: Prevent duplicate content issues
- [ ] **Internal links**: No broken links, descriptive anchor text
- [ ] **Image optimization**: Alt text, compressed, proper dimensions
- [ ] **HTTPS**: All pages served over HTTPS
- [ ] **XML sitemap**: Updated and submitted to GSC

## Monitoring and Maintenance

### Tools to Use

1. **Google Search Console**: Track rankings, impressions, clicks
2. **Google Analytics 4**: Monitor user behavior, traffic sources
3. **PageSpeed Insights**: Regular Core Web Vitals checks
4. **Ahrefs / SEMrush**: Competitor analysis, backlink monitoring
5. **Screaming Frog**: Site audits, crawl errors

### Regular SEO Tasks

**Weekly:**
- Monitor Search Console for errors
- Check top-performing pages

**Monthly:**
- Update old content with fresh information
- Fix broken links
- Review Core Web Vitals
- Analyze competitor rankings

**Quarterly:**
- Comprehensive site audit
- Update SEO strategy based on performance
- Refresh meta descriptions for underperforming pages
- Review and update structured data

## Resources

- [Google Search Central](https://developers.google.com/search) - Official SEO documentation
- [Schema.org](https://schema.org/) - Structured data vocabulary
- [PageSpeed Insights](https://pagespeed.web.dev/) - Performance testing
- [Google Search Console](https://search.google.com/search-console) - Monitor search performance
- [Web.dev](https://web.dev/) - Modern web best practices

---

When implementing SEO, always prioritize user experience. Search engines reward sites that provide genuine value to users. Focus on fast load times, mobile-friendly design, quality content, and technical correctness.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [anaghkanungo7](https://github.com/anaghkanungo7)
- **Source:** [anaghkanungo7/agent-skills](https://github.com/anaghkanungo7/agent-skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-anaghkanungo7-agent-skills-seo-optimization-guide
- Seller: https://agentstack.voostack.com/s/anaghkanungo7
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.