SEO Optimization Complete Guide

# SEO Optimization for Google Antigravity

Implement comprehensive SEO with sitemaps, structured data, and meta optimization.

## Dynamic Metadata

```typescript
// app/layout.tsx
import { Metadata } from "next";

export const metadata: Metadata = {
    metadataBase: new URL("https://yoursite.com"),
    title: { default: "Your Site", template: "%s | Your Site" },
    description: "Your site description",
    keywords: ["keyword1", "keyword2"],
    authors: [{ name: "Your Name" }],
    creator: "Your Name",
    openGraph: { type: "website", locale: "en_US", url: "https://yoursite.com", siteName: "Your Site", images: [{ url: "/og-image.png", width: 1200, height: 630 }] },
    twitter: { card: "summary_large_image", creator: "@yourhandle" },
    robots: { index: true, follow: true, googleBot: { index: true, follow: true, "max-video-preview": -1, "max-image-preview": "large", "max-snippet": -1 } },
    verification: { google: "your-verification-code" },
};
```

## Dynamic Sitemap

```typescript
// app/sitemap.ts
import { MetadataRoute } from "next";
import { createClient } from "@/lib/supabase/server";

export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
    const supabase = createClient();
    const baseUrl = "https://yoursite.com";

    // Fetch dynamic content
    const { data: posts } = await supabase.from("posts").select("slug, updated_at").eq("published", true);
    const { data: categories } = await supabase.from("categories").select("slug");

    const staticPages = [
        { url: baseUrl, lastModified: new Date(), changeFrequency: "daily" as const, priority: 1 },
        { url: `${baseUrl}/about`, lastModified: new Date(), changeFrequency: "monthly" as const, priority: 0.8 },
        { url: `${baseUrl}/contact`, lastModified: new Date(), changeFrequency: "monthly" as const, priority: 0.5 },
    ];

    const postPages = posts?.map((post) => ({
        url: `${baseUrl}/posts/${post.slug}`,
        lastModified: new Date(post.updated_at),
        changeFrequency: "weekly" as const,
        priority: 0.7,
    })) || [];

    const categoryPages = categories?.map((cat) => ({
        url: `${baseUrl}/categories/${cat.slug}`,
        lastModified: new Date(),
        changeFrequency: "weekly" as const,
        priority: 0.6,
    })) || [];

    return [...staticPages, ...postPages, ...categoryPages];
}
```

## Robots.txt

```typescript
// app/robots.ts
import { MetadataRoute } from "next";

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

## Structured Data Components

```typescript
// components/seo/StructuredData.tsx
export function WebsiteSchema() {
    const schema = {
        "@context": "https://schema.org",
        "@type": "WebSite",
        name: "Your Site",
        url: "https://yoursite.com",
        potentialAction: { "@type": "SearchAction", target: "https://yoursite.com/search?q={search_term_string}", "query-input": "required name=search_term_string" },
    };
    return <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }} />;
}

export function OrganizationSchema() {
    const schema = {
        "@context": "https://schema.org",
        "@type": "Organization",
        name: "Your Company",
        url: "https://yoursite.com",
        logo: "https://yoursite.com/logo.png",
        sameAs: ["https://twitter.com/yourhandle", "https://github.com/yourorg"],
    };
    return <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }} />;
}

export function BreadcrumbSchema({ items }: { items: { name: string; url: string }[] }) {
    const schema = {
        "@context": "https://schema.org",
        "@type": "BreadcrumbList",
        itemListElement: items.map((item, index) => ({
            "@type": "ListItem",
            position: index + 1,
            name: item.name,
            item: item.url,
        })),
    };
    return <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }} />;
}
```

## Canonical URLs

```typescript
// app/posts/[slug]/page.tsx
import { Metadata } from "next";

export async function generateMetadata({ params }: { params: { slug: string } }): Promise<Metadata> {
    const canonicalUrl = `https://yoursite.com/posts/${params.slug}`;
    return {
        alternates: { canonical: canonicalUrl },
    };
}
```

## SEO Audit Script

```typescript
// scripts/seo-audit.ts
import { createClient } from "@supabase/supabase-js";

const supabase = createClient(process.env.SUPABASE_URL!, process.env.SUPABASE_SERVICE_ROLE_KEY!);

async function auditSEO() {
    const { data: posts } = await supabase.from("posts").select("id, slug, title, description, content");

    const issues: { slug: string; issue: string }[] = [];

    posts?.forEach((post) => {
        if (!post.title || post.title.length < 30) issues.push({ slug: post.slug, issue: "Title too short (< 30 chars)" });
        if (post.title && post.title.length > 60) issues.push({ slug: post.slug, issue: "Title too long (> 60 chars)" });
        if (!post.description) issues.push({ slug: post.slug, issue: "Missing meta description" });
        if (post.description && post.description.length > 160) issues.push({ slug: post.slug, issue: "Description too long (> 160 chars)" });
        if (!post.content || post.content.length < 300) issues.push({ slug: post.slug, issue: "Content too short (< 300 chars)" });
    });

    console.log("SEO Audit Results:");
    console.table(issues);
}

auditSEO();
```

## Performance Optimization

```typescript
// next.config.js
module.exports = {
    images: { formats: ["image/avif", "image/webp"], deviceSizes: [640, 750, 828, 1080, 1200, 1920] },
    compress: true,
    poweredByHeader: false,
    async headers() {
        return [
            { source: "/(.*)", headers: [
                { key: "X-DNS-Prefetch-Control", value: "on" },
                { key: "X-Content-Type-Options", value: "nosniff" },
            ]},
        ];
    },
};
```

## Best Practices

1. **Unique Titles**: Each page should have a unique, descriptive title
2. **Meta Descriptions**: Write compelling descriptions under 160 chars
3. **Structured Data**: Add relevant schema markup
4. **Internal Linking**: Link between related content
5. **Performance**: Optimize Core Web Vitals