SEO Best Practices for Developers (2026)

Most SEO guides are written for marketers. They talk about "keyword research strategies" and "content pillars." You just want to know what to put in your HTML so Google ranks your pages correctly.

This guide is the developer version. No fluff. Just the technical SEO fundamentals that actually matter, with code you can copy.

1. Use semantic HTML

Search engines parse your HTML structure to understand content hierarchy. Using the right elements matters more than most devs realize.

• One <h1> per page — your main topic
• Use <h2> through <h6> in order — don't skip levels
• Use <article>, <section>, <nav>, <main>, <aside>, <header>, <footer>
• Use <time datetime="2026-02-12"> for dates
• Use <a> for navigation, <button> for actions — not the other way around

Googlebot understands semantic HTML natively. A page with proper structure ranks better than a soup of <div> tags, even with identical content.

2. Title tags: your most important meta tag

The title tag is the single most impactful on-page SEO element. It appears in search results, browser tabs, and social shares.

// Next.js App Router
export const metadata = {
  title: 'Pricing — Simple plans for every team | Indxel',
}

// Or dynamically
export function generateMetadata({ params }) {
  return {
    title: `${post.title} | My Blog`,
  }
}

Rules: keep it under 60 characters, put the primary keyword near the front, make every page title unique across your site.

3. Meta descriptions that get clicks

Meta descriptions don't directly affect rankings, but they affect click-through rate — which does. Write them like ad copy for developers.

export const metadata = {
  description: 'Run npx indxel check in CI. 15 SEO rules validated on every deploy. Broken metadata fails the build.',
}

Keep descriptions between 120-160 characters. Include your primary keyword. End with a value proposition or call to action. Every page needs a unique description.

4. Open Graph and Twitter cards

When someone shares your URL on Twitter, LinkedIn, or Slack, the preview is generated from Open Graph tags. Missing them means no image, no description — just a bare URL.

export const metadata = {
  openGraph: {
    title: 'SEO Best Practices for Developers',
    description: 'A practical checklist with code examples.',
    images: [{ url: 'https://yoursite.com/og/seo-guide.png', width: 1200, height: 630 }],
    type: 'article',
  },
  twitter: {
    card: 'summary_large_image',
  },
}

Always use 1200x630 images. Always verify the image URL returns 200. Test with Twitter's card validator.

5. Structured data with JSON-LD

JSON-LD tells Google what your page is about in a machine-readable format. It powers rich results: FAQ dropdowns, how-to steps, product ratings, article metadata.

// Add to your page component
const jsonLd = {
  '@context': 'https://schema.org',
  '@type': 'Article',
  headline: 'SEO Best Practices for Developers',
  datePublished: '2026-02-12',
  author: { '@type': 'Person', name: 'Your Name' },
}

// Render as script tag
<script
  type="application/ld+json"
  dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
/>

At minimum, add Organization schema to your layout and Article schema to blog posts. Validate with Google's Rich Results Test.

6. Performance is SEO

Core Web Vitals are a ranking factor. The three metrics that matter:

• LCP (Largest Contentful Paint) — under 2.5s. Optimize images, fonts, and above-the-fold content.
• INP (Interaction to Next Paint) — under 200ms. Minimize JavaScript, defer non-critical scripts.
• CLS (Cumulative Layout Shift) — under 0.1. Set explicit width/height on images and embeds.

Use next/image for automatic optimization. Use next/font for font loading without layout shift. Lazy-load below-the-fold content.

7. Canonical URLs and duplicate content

If the same content is accessible at multiple URLs (with/without trailing slash, with query params, HTTP vs HTTPS), search engines don't know which to rank. Canonical URLs solve this.

export const metadata = {
  alternates: {
    canonical: 'https://yoursite.com/blog/seo-guide',
  },
}

Always use absolute URLs. Set a canonical on every page. If you have paginated content, each page should canonical to itself, not to page 1.

8. Sitemaps and robots.txt

A sitemap tells search engines which URLs exist. Robots.txt tells them which URLs to skip. In Next.js, both are first-class:

// app/sitemap.ts
export default function sitemap() {
  return [
    { url: 'https://yoursite.com', lastModified: new Date() },
    { url: 'https://yoursite.com/blog', lastModified: new Date() },
  ]
}

// app/robots.ts
export default function robots() {
  return {
    rules: { userAgent: '*', allow: '/', disallow: ['/api/', '/dashboard/'] },
    sitemap: 'https://yoursite.com/sitemap.xml',
  }
}

Submit your sitemap to Google Search Console after deploying. Exclude private routes (API, auth, dashboard) from both sitemap and robots.

9. Indexation: getting Google to actually crawl you

Having great SEO on-page means nothing if Google never crawls your pages. For new sites, indexation can take days or weeks. Accelerate it by:

• Submitting your sitemap to Google Search Console
• Using the URL Inspection tool to request indexing for key pages
• Implementing IndexNow for instant notification on content changes
• Using the Google Indexing API for job postings and livestream content

Indxel's indexation engine automates this: it monitors which pages are indexed, auto-submits new URLs, and retries pages that Google hasn't picked up yet.

10. Automate everything with CI/CD

Manual SEO checks don't scale. You'll forget. Your teammates will forget. The only reliable solution is automation.

# Add to your build command
npx indxel check --ci

# Or run the full checklist locally
npx indxel check

This validates all the rules above on every page in your app. Title lengths, meta descriptions, og:images, JSON-LD, canonical URLs, robots directives — everything. If something breaks, the build fails. SEO regressions never reach production.

The goal is simple: treat SEO like type safety. If it compiles, it's correct. If it deploys, the SEO is intact. That's what infrastructure-level SEO means.

For a complete checklist you can follow step by step, see our Next.js SEO Checklist 2026. You can also check your meta tags from the terminal right now.