At the top level, SEO for a Next.js site is the same as for any site: clear relevance, crawlability, good UX signals, and trust. Next.js just gives you fast defaults and first-class metadata hooks if you use them deliberately.

Below is a checklist of important keys and themes—then each one is unpacked with a Next.js lens (mostly App Router; Pages Router ideas are noted where they differ).

---

Key areas at a glance

1. Metadata API — metadata / generateMetadata (title, description, canonical, OG, Twitter).
2. Unique titles and descriptions — every indexable URL should have distinct, accurate meta.
3. Canonical URLs — one preferred URL per piece of content; avoid duplicate signals.
4. Open Graph & Twitter cards — how links look when shared; can affect CTR indirectly.
5. robots.txt — allow/disallow crawling; point to sitemap.
6. XML sitemap — discoverable list of important URLs and change hints.
7. Structured data (JSON-LD) — Article, BreadcrumbList, Organization, etc.
8. Performance & Core Web Vitals — LCP, INP, CLS; speed is a ranking and UX factor.
9. Semantic HTML & heading hierarchy — one main topic per page; logical h1–h3.
10. URL structure & internal linking — stable, readable paths; links pass context.
11. Images — next/image, dimensions, meaningful alt, modern formats where possible.
12. Internationalization — locale routes, hreflang or equivalent when you have true alternates.
13. Security & polish — HTTPS, no accidental noindex, sensible error pages.

---

1. Metadata API (App Router)

Next.js App Router exposes route-level metadata via the metadata export or generateMetadata for dynamic routes (e.g. blog slugs). This is how you set title, description, and other link-preview fields in a type-safe, colocated way.

Why it matters: Search engines use title and meta description (among many signals) for snippets. Social platforms use Open Graph and Twitter tags for previews.

Practice: Centralize defaults in a root layout.tsx, override per segment. For dynamic pages, compute title/description from your CMS or database inside generateMetadata.

---

2. Unique titles and descriptions

Duplicate or missing titles make it harder for Google to show the right snippet and can dilute relevance.

Practice: Template titles like "Post Title | Site Name". Descriptions: one to two factual sentences; avoid keyword stuffing. If a page should not be indexed (drafts, faceted duplicates), use robots noindex (see below)—do not rely on a bad description to “hide” a page.

---

3. Canonical URLs

Canonical (alternates.canonical in the Metadata API) tells search engines which URL is authoritative when the same content could exist under multiple URLs (tracking params, www vs bare domain, HTTP vs HTTPS).

Practice: Pick a single host and scheme; redirect the rest. Set canonical on listing + detail pages where duplicates are possible.

---

4. Open Graph and Twitter cards

Open Graph (openGraph in metadata) and Twitter (twitter) control link unfurls. They are not a direct “ranking button,” but better CTR from social can bring links and traffic.

Practice: Set title, description, url, and images with absolute URLs where required. Use a sensible default OG image per template.

---

5. robots.txt

Use app/robots.ts (or static public/robots.txt) to allow crawling of public content and disallow admin or private areas. Reference your sitemap URL.

Practice: Do not block CSS/JS needed to render; Google needs to see the page as users do.

---

6. XML sitemap

app/sitemap.ts can emit URLs from your data layer (blog posts, projects). Helps discovery; it does not guarantee indexing.

Practice: Include only URLs you want indexed; keep lastModified reasonably accurate if you output it. Split sitemaps if you exceed size limits.

---

7. Structured data (JSON-LD)

JSON-LD (<script type="application/ld+json">) clarifies entities: articles, breadcrumbs, organization, person, FAQ (only if content truly matches Google’s rules).

Practice: Validate with Google’s Rich Results Test. Do not fake schema; mismatches can be ignored or penalized.

---

8. Performance and Core Web Vitals

LCP (largest content paint), INP (interaction to next paint), and CLS (layout shift) correlate with user satisfaction; Google uses them as signals.

Next.js helps with automatic code splitting, image optimization, and font strategies, but you still must: avoid huge client bundles on critical paths, lazy-load non-critical widgets, and reserve space for images/embeds to reduce CLS.

---

9. Semantic HTML and headings

Use landmarks (main, nav, article, header, footer) and a single clear h1 per view where possible. Headings should outline the content, not decorate it.

Practice: Server-render meaningful HTML; do not replace all text with client-only placeholders for core content.

---

10. URL structure and internal linking

Short, stable, readable URLs beat opaque IDs when everything else is equal. Internal links help bots and users discover related pages and spread relevance.

Practice: Use <Link> for client navigation; ensure important pages are reachable within a few clicks from the home page.

---

11. Images

Use next/image with width/height (or fill with a sized container) to reduce CLS. alt should describe the image’s role in the page, not a dump of keywords.

Practice: Prefer appropriate formats (often WebP/AVIF via the optimizer) and avoid multi-megabyte hero images.

---

12. Internationalization

If you ship multiple locales, use Next.js i18n routing and expose consistent alternate URLs. hreflang (or equivalent linking between language versions) reduces wrong-country results when implemented correctly.

Practice: One URL per locale; avoid automatic IP-based language redirects without clear alternatives for crawlers.

---

13. Security and accidental de-indexing

Serve HTTPS. Watch for noindex in metadata or headers on production pages by mistake. Soft 404s (200 OK with “not found” text) confuse search engines—return proper 404/410 status codes.

---

Closing

SEO is iterative: ship correct metadata and technical basics, publish useful pages, measure in Search Console, and refine. Next.js does not replace good content—it makes the technical layer easier when you align these keys with your actual site structure.

---

This article is general educational guidance, not a guarantee of rankings; algorithms and guidelines change.