How to Add SEO to a Next.js App: The Complete 2026 Checklist

Next.js gives you the APIs. This guide tells you which ones to use, in what order, and what to check before calling it done. Organized as a checklist — work through it top to bottom.

Foundation (do first)

1. Set metadataBase in app/layout.tsx. Every OG image, canonical, and sitemap URL resolves against this. Without it, paths are relative and social previews break.
2. Add generateMetadata to every public page. Title (55–60 chars), description (150–160 chars), alternates.canonical pointing to itself.
3. Set the title template: { default: "Site", template: "%s | Site" }. Use title.absolute on the homepage to avoid double-branding.
4. Create sitemap.ts with all public routes. Tier priorities: homepage 1.0, money pages 0.8–0.9, blog 0.6–0.7. Use real lastModified dates, not new Date(). Once it's live, run it through the free sitemap inspector to confirm the URL count and freshness look right before you submit it to GSC.
5. Create robots.ts. Disallow /api/, /dashboard, /editor/, auth routes. Point to sitemap. Not sure what to disallow, or want AI-crawler blocking presets? The free robots.txt generator builds it with a line-by-line explanation.

Structured data

1. Organization JSON-LD in root layout (once, globally).
2. BreadcrumbList on every non-homepage page.
3. FAQPage on any page with a visible FAQ accordion.
4. BlogPosting on blog posts with datePublished, dateModified, author.
5. Product + Offer on pricing pages with real prices.

Open Graph images

1. Create opengraph-image.tsx in the app root. Use ImageResponse with edge runtime. 1200×630px.
2. Per-route OG images for money pages. Each route folder can have its own opengraph-image.tsx.
3. Test with the Facebook Debugger and Twitter Card Validator.

Core Web Vitals

1. Font display: swap on all Google Fonts.
2. images.formats: ["image/avif", "image/webp"] in next.config.
3. Above-fold images get priority. Below-fold get loading="lazy".
4. DNS prefetch for external image domains.
5. Third-party scripts use strategy="lazyOnload".

Security headers (trust signals)

1. HSTS with includeSubDomains; preload.
2. X-Content-Type-Options: nosniff
3. X-Frame-Options: SAMEORIGIN
4. Referrer-Policy: strict-origin-when-cross-origin
5. X-Robots-Tag: noindex on preview/non-canonical hosts.

Internal linking

1. Header nav links to all money pages.
2. Footer links to all public pages + legal pages.
3. Every page has ≥3 inbound internal links.
4. Blog posts cross-link to related posts.
5. No href="#" placeholder links anywhere.

Final verification

Before submitting to Google Search Console:

• Every page has a unique title and description — check truncation with the free SERP simulator before you ship it.
• Every page has exactly one <h1>.
• Every page's canonical tag points to itself, not somewhere else — verify with the free canonical URL checker.
• Sitemap returns 200 and valid XML.
• No noindex'd pages appear in the sitemap.
• Rich Results Test passes for all schema types.
• PageSpeed Insights scores green on all three Core Web Vitals.
• Run the page through a free on-page audit as a final gate — it checks the title, canonical, OG image, JSON-LD, and indexability signals above in one pass.