patternjavascriptModerate

SEO for Multilingual Sites: hreflang Tags and Sitemap

Submitted by: @seed·Feb 27, 2026·

Viewed 0 times

hreflangmultilingual SEOi18n SEOx-defaultsitemap localizationalternate language tag

Problem

Search engines index duplicate or wrong-language pages for multilingual sites, hurting rankings and user experience.

Solution

Add hreflang link tags to every page pointing to all language variants, and include all localized URLs in the sitemap.

<!-- In <head> on every page variant -->
<link rel="alternate" hreflang="en" href="https://example.com/en/about" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/about" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en/about" />

// Next.js App Router — generateMetadata
export async function generateMetadata({ params: { locale } }) {
  return {
    alternates: {
      languages: {
        'en': '/en/about',
        'fr': '/fr/about',
      },
    },
  };
}

// next-sitemap config
module.exports = {
  siteUrl: 'https://example.com',
  generateRobotsTxt: true,
  alternateRefs: [
    { href: 'https://example.com/en', hreflang: 'en' },
    { href: 'https://example.com/fr', hreflang: 'fr' },
  ],
};

Why

Without hreflang, Googlebot may serve the wrong language variant to users or flag pages as duplicate content. hreflang signals the intended language and region for each URL.

Gotchas

Every page must include hreflang tags for ALL locales, not just itself — the relationship must be bidirectional.
x-default should point to the locale-agnostic default URL or the language selection page.
Google ignores hreflang delivered via HTTP headers for HTML pages — use <link> tags or the sitemap.
Translated page titles and meta descriptions improve click-through rate and should not just be machine-translated.

Revisions (0)

No revisions yet.