Advanced SEO

A comprehensive skill for implementing technical SEO optimizations including Lighthouse audit improvements, structured data markup, Core Web Vitals optimization, crawlability enhancements, and content strategy aligned with search engine guidelines.

When to Use This Skill

Choose this skill when:

• Improving Lighthouse SEO audit scores and resolving specific warnings
• Implementing structured data (JSON-LD) for rich search results
• Optimizing Core Web Vitals (LCP, FID/INP, CLS) for search ranking
• Fixing crawlability issues with sitemaps, robots.txt, and canonical URLs
• Building SEO-friendly rendering strategies (SSR, SSG, ISR)

Consider alternatives when:

• Working on content writing/copywriting → use a content strategy skill
• Need general performance optimization → use a web performance skill
• Building link-building campaigns → use a marketing skill
• Managing Google Ads/PPC → use a paid search skill

Quick Start

Copy
// Next.js SEO configuration with metadata API
// app/layout.tsx
import { Metadata } from 'next';

export const metadata: Metadata = {
  metadataBase: new URL('https://example.com'),
  title: { default: 'My App', template: '%s | My App' },
  description: 'A comprehensive web application',
  openGraph: {
    type: 'website',
    locale: 'en_US',
    siteName: 'My App',
  },
  twitter: { card: 'summary_large_image', creator: '@myapp' },
  robots: {
    index: true,
    follow: true,
    googleBot: { index: true, follow: true, 'max-snippet': -1 },
  },
  alternates: { canonical: '/' },
};

Copy
<!-- Structured data for product page -->
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Premium Widget",
  "description": "High-quality widget for professionals",
  "image": "https://example.com/widget.jpg",
  "brand": { "@type": "Brand", "name": "WidgetCo" },
  "offers": {
    "@type": "Offer",
    "price": "29.99",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock"
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.5",
    "reviewCount": "127"
  }
}
</script>

Core Concepts

SEO Ranking Factors

Factor	Impact	Technical Implementation
Content Relevance	Very High	Keyword research, topical authority, E-E-A-T
Core Web Vitals	High	LCP < 2.5s, INP < 200ms, CLS < 0.1
Mobile Friendliness	High	Responsive design, viewport meta, touch targets
HTTPS	Medium	TLS 1.3, HSTS, secure cookies
Page Speed	High	Asset optimization, caching, CDN
Structured Data	Medium	JSON-LD schemas for rich results
Crawlability	High	Sitemap, robots.txt, internal linking
Backlinks	Very High	Quality content, outreach (not technical)

Technical SEO Checklist

Copy
// Automated SEO audit script
const seoAudit = {
  meta: [
    'Every page has unique <title> (50-60 chars)',
    'Every page has unique <meta description> (150-160 chars)',
    'Canonical URL set on every page',
    'Open Graph tags present (og:title, og:description, og:image)',
    'hreflang tags for multi-language sites',
  ],
  performance: [
    'LCP under 2.5 seconds on mobile',
    'INP under 200 milliseconds',
    'CLS under 0.1',
    'Total page weight under 3MB',
    'Critical CSS inlined, non-critical deferred',
  ],
  crawlability: [
    'XML sitemap at /sitemap.xml with all indexable URLs',
    'robots.txt allows crawling of important paths',
    'No orphan pages (every page linked internally)',
    'No redirect chains (max 1 redirect hop)',
    'HTTP status codes correct (200, 301, 404)',
  ],
  structure: [
    'Single H1 per page with target keyword',
    'Heading hierarchy (H1 → H2 → H3) without skipping',
    'Image alt text descriptive and keyword-relevant',
    'Internal links with descriptive anchor text',
    'Breadcrumb navigation with structured data',
  ],
};

Dynamic Sitemap Generation

Copy
// app/sitemap.ts (Next.js)
import { MetadataRoute } from 'next';
import { db } from '@/lib/db';

export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
  const products = await db.product.findMany({
    select: { slug: true, updatedAt: true },
    where: { published: true },
  });

  const blogs = await db.post.findMany({
    select: { slug: true, updatedAt: true },
    where: { status: 'published' },
  });

  return [
    { url: 'https://example.com', lastModified: new Date(), changeFrequency: 'daily', priority: 1 },
    { url: 'https://example.com/products', changeFrequency: 'daily', priority: 0.9 },
    ...products.map(p => ({
      url: `https://example.com/products/${p.slug}`,
      lastModified: p.updatedAt,
      changeFrequency: 'weekly' as const,
      priority: 0.8,
    })),
    ...blogs.map(b => ({
      url: `https://example.com/blog/${b.slug}`,
      lastModified: b.updatedAt,
      changeFrequency: 'monthly' as const,
      priority: 0.7,
    })),
  ];
}

Configuration

Parameter	Type	Default	Description
renderingStrategy	string	'ssr'	Rendering: SSR, SSG, ISR, or CSR
sitemapFormat	string	'xml'	Sitemap format: XML or dynamic
structuredDataType	string	'json-ld'	Markup format: JSON-LD or microdata
canonicalBase	string	''	Base URL for canonical tags
robotsPolicy	string	'index,follow'	Default robots directive
hreflangEnabled	boolean	false	Enable multi-language hreflang tags

Best Practices

1. Server-render pages that need SEO, client-render dashboards — Search engines can execute JavaScript, but SSR/SSG provides faster indexing and better Core Web Vitals. Use SSR or ISR for public-facing pages and CSR for authenticated dashboards.

2. Implement one canonical URL per page and enforce it — Duplicate content from URL parameters, trailing slashes, or www/non-www variants dilutes ranking signals. Set canonical URLs explicitly and redirect non-canonical variants with 301 redirects.

3. Use JSON-LD structured data for rich result eligibility — Search engines prefer JSON-LD over inline microdata. Implement Product, Article, FAQ, HowTo, and BreadcrumbList schemas where applicable. Validate with Google's Rich Results Test.

4. Optimize images with modern formats, responsive sizes, and lazy loading — Use WebP/AVIF with <picture> fallbacks. Set explicit width and height to prevent CLS. Lazy-load below-fold images and eagerly load the LCP image.

5. Build a strong internal linking structure — Every important page should be reachable within 3 clicks from the homepage. Use descriptive anchor text, implement breadcrumbs, and create topic clusters that link related content together.

Common Issues

Client-rendered content not indexed by search engines — While Googlebot can render JavaScript, it's slower and less reliable than HTML. Dynamic content may not be indexed for weeks. Switch critical pages to SSR/SSG for immediate indexability.

Core Web Vitals failing on mobile but passing on desktop — Mobile has stricter thresholds and slower hardware. Test with Lighthouse in mobile mode and Chrome DevTools throttling. Common fixes: reduce hero image size, defer non-critical JavaScript, and eliminate layout shifts from dynamic content.

Duplicate content across paginated pages or filter URLs — Pagination should use rel="next"/rel="prev" (although Google says they ignore it, other engines may not). Filter URLs should have noindex meta tags or canonical URLs pointing to the main category page.