SEO Best Practices for Next.js Blogs

Learn how to make your Next.js blog search engine friendly.

Essential SEO Elements

1. Meta Tags

Every page should have unique, descriptive meta tags. In Next.js, use the generateMetadata function:

export async function generateMetadata({ params }) {
  return {
    title: 'Your Page Title',
    description: 'Your description (< 160 chars)',
    authors: [{ name: 'Author Name' }],
  }
}

2. Semantic URLs

Use readable URLs:

• ✅ Good: /posts/seo-best-practices
• ❌ Bad: /posts/12345

Next.js App Router automatically creates semantic URLs based on your file structure.

3. Image Optimization

• Use descriptive alt text
• Compress images (WebP format preferred)
• Lazy load images below the fold

For static export, set images: { unoptimized: true } in next.config.js.

4. Site Structure

Essential files for SEO:

• sitemap.xml - List all pages for search engines
• robots.txt - Tell search engines what to crawl
• Proper heading hierarchy - H1 → H2 → H3

5. Core Web Vitals

These metrics matter for SEO rankings:

Metric	Target	Description
LCP	< 2.5s	Largest Contentful Paint
FID	< 100ms	First Input Delay
CLS	< 0.1	Cumulative Layout Shift

Static Export Benefits

With Next.js static export:

1. HTML is pre-rendered at build time
2. No server rendering delay (TTFB is minimal)
3. Perfect for SEO crawlers
4. Can be hosted anywhere (Cloudflare, Vercel, Netlify, S3)

Deployment to Cloudflare

Cloudflare Workers provides:

• Global CDN with 300+ data centers
• Automatic SSL/TLS
• DDoS protection
• Free tier for static sites

Structured Data

Add JSON-LD structured data for rich snippets:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BlogPosting",
  "headline": "Your Article Title",
  "description": "Your description",
  "author": {
    "@type": "Person",
    "name": "Author Name"
  }
}
</script>

Conclusion

Following these practices will help your blog rank higher in search results! Static export with Next.js and Cloudflare Workers is an excellent combination for SEO.

---

Next Steps:

1. Set up Google Search Console
2. Create a sitemap
3. Monitor Core Web Vitals
4. Build quality backlinks