Next.js App Router SEO Checklist: 15 Things to Get Right Before Launch

Next.js gives you server rendering, fast navigation and a built-in Metadata API, which are a great base for SEO. But good defaults are not the same as a well-optimised site. This checklist covers what we verify on every Next.js App Router project before launch.

Rendering and crawlability

1. Render important content on the server. Search engines can run JavaScript, but server-rendered HTML is indexed faster and more reliably. Keep headings, body text and links in server components where possible.

2. Use real links. Navigation should use <Link href="..."> so crawlers see normal <a> tags. Avoid click handlers that change pages without an href.

3. Return correct status codes. Call notFound() for missing content so the page returns 404, not a 200 page that says "not found".

Metadata

4. Set unique titles and descriptions. Use a title template in the root layout and generateMetadata on dynamic pages:

// app/layout.tsx
export const metadata = {
  title: { default: "Acme Store", template: "%s | Acme Store" },
  description: "Hand-made furniture delivered across the region.",
};

// app/products/[slug]/page.tsx
export async function generateMetadata({ params }) {
  const product = await getProduct((await params).slug);
  return { title: product.name, description: product.summary };
}

5. Add canonical URLs. Set metadataBase once, then alternates: { canonical: "/products/" + slug } per page. This prevents duplicates from query strings and tracking parameters.

6. Open Graph and social previews. Provide openGraph images (1200×630) so links look good when shared on WhatsApp, LinkedIn and X.

7. Language alternates. For multilingual sites, add alternates.languages (hreflang) so Google shows the right language version.

Sitemaps and robots

8. Generate sitemap.ts. Include only canonical, indexable URLs with a sensible lastModified:

// app/sitemap.ts
export default async function sitemap() {
  const posts = await getPublishedPosts();
  return [
    { url: "https://example.com", lastModified: new Date() },
    ...posts.map((p) => ({ url: `https://example.com/blog/${p.slug}`, lastModified: p.updatedAt })),
  ];
}

9. Generate robots.ts. Allow public pages, disallow admin and API routes, and point to the sitemap. Double-check you are not blocking CSS, JS or images.

10. Keep thin pages out of the index. Internal search results, filters and empty tag pages should use robots: { index: false }.

Structured data

11. Add JSON-LD where it fits. Use Article or BlogPosting for posts, Product for products, BreadcrumbList for breadcrumbs and Organization site-wide. Render it in a <script type="application/ld+json"> tag, and validate it with Google's Rich Results Test.

Performance and Core Web Vitals

12. Optimise images. Use next/image or correctly sized images with width and height to avoid layout shift. Lazy-load below-the-fold images.

13. Control fonts. Use next/font or preconnect to font hosts and limit weights. Unused font weights slow the first render.

14. Ship less JavaScript. Keep components on the server unless they need interactivity. Third-party scripts such as analytics, chat widgets and ads should load with next/script using afterInteractive or lazyOnload.

15. Measure real users. Lab scores are useful, but Google uses field data. Check Core Web Vitals in Search Console and fix the slowest templates first.

After launch

• Submit the sitemap in Google Search Console and check the Pages report for indexing problems.
• Watch for "Duplicate without user-selected canonical" and "Crawled, currently not indexed" warnings.
• Link new content from the homepage and category pages. Internal links help discovery.
• Publish consistently. A technically perfect site with no useful content will not rank.

Frequently asked questions

Does Google index client-rendered content? Google can render JavaScript, but rendering may be delayed and other search engines and social preview bots are less capable. Server-rendered HTML is the safer choice for important content.

Should every page be in the sitemap? No. Only canonical, indexable pages that you want to rank. Leave out search results, filters, admin pages and thin tag pages.

How long until new pages appear in Google? It varies from hours to weeks. Submitting the sitemap, linking new pages from the homepage and using URL inspection in Search Console usually speeds things up.

Key takeaways

• Server-render content, use real links and return proper status codes.
• Use the Metadata API for titles, descriptions, canonical URLs, Open Graph and hreflang.
• Generate sitemap and robots files from your data, and keep thin pages out of the index.
• Measure Core Web Vitals with real-user data and optimise images, fonts and scripts.

KHR Digital Solutions builds fast, SEO-ready websites and web apps with Next.js and ASP.NET Core. A pre-launch SEO review usually takes a day and saves months of lost traffic.