Use hreflang for international SEO

Q: `en` vs `en-US` vs `en-GB`?

Use the broadest tag that fits. en covers all English speakers; en-US targets US English specifically. If you serve identical content to UK and US users, declare en once — not en-US and en-GB separately, which dilutes the signal and adds maintenance.

What this check does

Parses every <link rel="alternate" hreflang="…" href="…"> tag in the page <head> (and in the XML sitemap, if present). The check fails when:

The page has localized siblings (other URLs serving the same content in a different language) but no hreflang declarations.
The hreflang values aren’t valid BCP 47 tags (en, en-US, es, de-AT, zh-Hant-TW).
The hreflang network is broken: A points to B, B doesn’t point back to A.
The x-default is missing (recommended for international fallback).

Why it matters

Google decides which URL to surface for a search by matching the user’s language and region against the hreflang network. Without it, three things go wrong:

The wrong URL ranks. A US user searching in English sees your Spanish page (or vice versa) because Google picked the highest-authority URL, not the one for the user’s locale.
Duplicate-content penalties. Two URLs with near-identical content (same product, translated copy) compete with each other. Google drops one to avoid duplicates — sometimes the wrong one.
CTR drops. Even when the user lands on the right page, an English snippet for a Spanish user reduces click-through. Hreflang lets Google show the localized snippet.

Hreflang is opinion-free metadata — it doesn’t influence rank, it just routes the right URL to the right user.

How to fix it

Every page in a multilingual network needs to:

List every other variant of itself, including itself.
Be listed by every other variant.
Include x-default for the catch-all language/region.

Example: English (US default), Spanish, German, x-default. On the English page:

<link rel="alternate" hreflang="en" href="https://example.com/" />
<link rel="alternate" hreflang="es" href="https://example.com/es/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/" />

The same four tags must appear on the Spanish page, the German page, and any other variant. All four pages declare the entire network, including themselves.

Astro:

---
const locales = ["en", "es", "de"] as const;
const path = Astro.url.pathname.replace(/^\/(es|de)\//, "/");
---
{locales.map(loc => (
  <link rel="alternate" hreflang={loc}
    href={`${Astro.site}${loc === "en" ? "" : loc + "/"}${path.slice(1)}`} />
))}
<link rel="alternate" hreflang="x-default" href={`${Astro.site}${path.slice(1)}`} />

Next.js:

// app/[locale]/page.tsx
export async function generateMetadata({ params }: { params: { locale: string }}) {
  const path = "/"; // or your route path
  return {
    alternates: {
      canonical: `https://example.com${path}`,
      languages: {
        en: `https://example.com${path}`,
        es: `https://example.com/es${path}`,
        de: `https://example.com/de${path}`,
        "x-default": `https://example.com${path}`,
      },
    },
  };
}

WordPress — Polylang and WPML output hreflang automatically once you’ve linked each translation. WordPress Multisite needs the HREFLang Tags Lite plugin or equivalent.

Sitemap-based hreflang — for sites with thousands of localized URLs, declaring hreflang in the sitemap is cleaner than in every page’s HTML:

<url>
  <loc>https://example.com/</loc>
  <xhtml:link rel="alternate" hreflang="en" href="https://example.com/"/>
  <xhtml:link rel="alternate" hreflang="es" href="https://example.com/es/"/>
  <xhtml:link rel="alternate" hreflang="de" href="https://example.com/de/"/>
  <xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/"/>
</url>

Test it. Google Search Console → Insights → International Targeting flags missing return links and invalid tags. Run hreflang.org or Merkle’s hreflang validator for a one-off check.

Frequently asked questions

`en` vs `en-US` vs `en-GB`?

Use the broadest tag that fits. en covers all English speakers; en-US targets US English specifically. If you serve identical content to UK and US users, declare en once — not en-US and en-GB separately, which dilutes the signal and adds maintenance.

Do I need hreflang if my site is single-language?

No. Hreflang is only useful when you have alternate-language URLs. A single-language site needs <html lang="…"> (see Declare page language) but not hreflang.

What’s `x-default` for?

It’s the catch-all. When the user’s language doesn’t match any declared hreflang, Google routes them to the x-default URL. Typically this is the English homepage or a language-picker page.