DEV Community

Aarju Shivnani
Aarju Shivnani

Posted on

"Technical SEO Checklist for Next.js Business Websites"

description: "A practical technical SEO checklist for Next.js: metadata, sitemap, robots, structured data, Core Web Vitals and local SEO, with code examples."
tags: nextjs, seo, webdev, javascript
cover_image:

canonical_url:

Building a fast website is only half the job. If search engines can't crawl, understand and rank it, your client's business stays invisible. This is the technical SEO checklist I use for Next.js business websites, with code you can copy.

1. Unique Metadata for Every Page

Every page needs its own title and description. In the Next.js App Router, use the Metadata API:

// app/web-development/page.js
export const metadata = {
  title: "\"Website Development Services in Bhopal | Your Brand\","
  description: ""
    "Custom, responsive and SEO-friendly websites for businesses in Bhopal and across India.",
  alternates: { canonical: "https://www.example.com/web-development" },
  openGraph: {
    title: "\"Website Development Services\","
    description: "\"Custom, fast and SEO-friendly websites.\","
    url: "https://www.example.com/web-development",
    type: "website",
  },
};
Enter fullscreen mode Exit fullscreen mode

Keep titles under about 60 characters and descriptions under about 160. Always set a canonical URL to avoid duplicate content issues.

2. Generate a Sitemap and robots.txt

// app/sitemap.js
export default function sitemap() {
  const base = "https://www.example.com";
  return ["", "/about", "/services", "/portfolio", "/contact"].map((path) => ({
    url: `${base}${path}`,
    lastModified: new Date(),
  }));
}
Enter fullscreen mode Exit fullscreen mode
// app/robots.js
export default function robots() {
  return {
    rules: { userAgent: "*", allow: "/", disallow: ["/login", "/admin"] },
    sitemap: "https://www.example.com/sitemap.xml",
  };
}
Enter fullscreen mode Exit fullscreen mode

Submit the sitemap in Google Search Console and check the Coverage report regularly.

3. Add Structured Data (JSON-LD)

Structured data helps search engines understand your business. For local businesses, LocalBusiness schema is a good start:

export default function LocalBusinessSchema() {
  const schema = {
    "@context": "https://schema.org",
    "@type": "LocalBusiness",
    name: "Your Business Name",
    url: "https://www.example.com",
    telephone: "+91-XXXXXXXXXX",
    address: {
      "@type": "PostalAddress",
      streetAddress: "Your street address",
      addressLocality: "Bhopal",
      addressRegion: "Madhya Pradesh",
      postalCode: "462011",
      addressCountry: "IN",
    },
  };

  return (
    <script
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
    />
  );
}
Enter fullscreen mode Exit fullscreen mode

Validate it with Google's Rich Results Test.

4. Optimize Images with next/image

Images are often the biggest cause of slow pages.

import Image from "next/image";

<Image
  src="/hero.webp"
  alt="Team working on a website project"
  width={1200}
  height={630}
  priority
/>
Enter fullscreen mode Exit fullscreen mode
  • Use descriptive alt text (it helps accessibility and image search)
  • Set priority only for above-the-fold images
  • Prefer WebP or AVIF formats

5. Core Web Vitals

Google uses real-user performance data as a ranking signal. Focus on:

Metric What it measures Good target
LCP Loading speed of main content under 2.5s
INP Responsiveness to interaction under 200ms
CLS Visual stability under 0.1

Quick wins: lazy-load below-the-fold content, use next/font to avoid layout shifts, remove unused JavaScript, and use dynamic imports for heavy components.

6. Use Server Rendering Where It Matters

Content that must be indexed (service pages, blog posts, landing pages) should be rendered on the server or statically generated, not loaded only after client-side JavaScript runs. Use Server Components, SSG or ISR for these pages.

7. Clean URLs and Internal Linking

  • Use readable URLs: /web-development, not /page?id=42
  • Link related pages to each other with descriptive anchor text
  • Keep important pages within three clicks of the homepage
  • Set up proper 301 redirects when URLs change

8. Local SEO Basics

For businesses serving a specific city:

  • Create and verify a Google Business Profile
  • Keep Name, Address and Phone (NAP) consistent everywhere
  • Add city-specific content naturally, without keyword stuffing
  • Encourage genuine customer reviews

Final Checklist

  • [ ] Unique title and meta description on every page
  • [ ] Canonical URLs set
  • [ ] Sitemap and robots.txt live
  • [ ] Structured data validated
  • [ ] Images optimized with alt text
  • [ ] Core Web Vitals in the green
  • [ ] Key pages server-rendered
  • [ ] Mobile-friendly and HTTPS enabled
  • [ ] Google Search Console connected

Wrapping Up

Technical SEO isn't a one-time task. Audit regularly, measure with Search Console and Lighthouse, and improve step by step.

If you're a business in Bhopal looking for help with website development, SEO or digital marketing, you can check out the team at I Next ETS, which offers web development, mobile apps, social media marketing and more.

Disclosure: I'm associated with I Next ETS.

What technical SEO issues have you run into on Next.js projects? Share in the comments.

Top comments (0)