Tilbage til Teknisk SEO
🌍

Hreflang Guide

International SEO for multi-language og multi-regional websites

Hvad er Hreflang?

Hreflang er et HTML attribute der fortæller søgemaskiner om sprog og geografisk targeting af en side. Det sikrer at brugere ser den korrekte sprog/regional version af dit indhold i søgeresultater.

Hreflang løser:

  • • Duplicate content issues mellem sprog versioner
  • • Forkert sprog version i søgeresultater
  • • Regional targeting (UK vs US engelsk f.eks.)
  • • Korrekt version til brugernes location og sprog

Basic Syntax

Hreflang HTML Tag

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

rel="alternate": Specificerer alternativ version

hreflang: ISO 639-1 sprog kode (2 bogstaver)

href: URL til den specifikke sprog version

x-default: Default/fallback version

Language Codes

Brug ISO 639-1 sprog koder (2 bogstaver):

daDansk
enEngelsk
deTysk
frFransk
esSpansk
itItaliensk
nlHollandsk
svSvensk
noNorsk
fiFinsk
plPolsk
ptPortugisisk

Language + Region Codes

For regional versioner, kombiner sprog + ISO 3166-1 Alpha 2 region kode:

en-USEngelsk for USA
en-GBEngelsk for Storbritannien
en-AUEngelsk for Australien
de-DETysk for Tyskland
de-ATTysk for Østrig
fr-FRFransk for Frankrig
fr-CAFransk for Canada

Implementation Methods

1. HTML <head> Tags (anbefalet)

<head>
  <!-- Dansk version -->
  <link rel="alternate" hreflang="da" href="https://example.com/da/" />

  <!-- Engelsk version -->
  <link rel="alternate" hreflang="en" href="https://example.com/en/" />

  <!-- Tysk version -->
  <link rel="alternate" hreflang="de" href="https://example.com/de/" />

  <!-- Default/fallback -->
  <link rel="alternate" hreflang="x-default" href="https://example.com/" />
</head>

2. HTTP Header

For non-HTML filer (PDFs, etc.):

Link: <https://example.com/da/file.pdf>; rel="alternate"; hreflang="da",
      <https://example.com/en/file.pdf>; rel="alternate"; hreflang="en",
      <https://example.com/>; rel="alternate"; hreflang="x-default"

3. XML Sitemap

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:xhtml="http://www.w3.org/1999/xhtml">
  <url>
    <loc>https://example.com/da/</loc>
    <xhtml:link rel="alternate" hreflang="da" href="https://example.com/da/"/>
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/"/>
    <xhtml:link rel="alternate" hreflang="de" href="https://example.com/de/"/>
    <xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/"/>
  </url>
</urlset>

Complete Example

Website med dansk, engelsk og tysk version + regional engelsk versioner:

<!-- På https://example.com/da/products/widget -->
<head>
  <!-- Self-referencing -->
  <link rel="alternate" hreflang="da"
        href="https://example.com/da/products/widget" />

  <!-- English versions -->
  <link rel="alternate" hreflang="en-US"
        href="https://example.com/en-us/products/widget" />
  <link rel="alternate" hreflang="en-GB"
        href="https://example.com/en-gb/products/widget" />
  <link rel="alternate" hreflang="en"
        href="https://example.com/en/products/widget" />

  <!-- German -->
  <link rel="alternate" hreflang="de"
        href="https://example.com/de/products/widget" />

  <!-- Default fallback -->
  <link rel="alternate" hreflang="x-default"
        href="https://example.com/products/widget" />
</head>

Next.js Implementation

// app/[lang]/page.tsx
import { headers } from 'next/headers'

export async function generateMetadata({ params }) {
  const { lang } = params
  const baseUrl = 'https://example.com'

  return {
    alternates: {
      canonical: `${baseUrl}/${lang}`,
      languages: {
        'da': `${baseUrl}/da`,
        'en': `${baseUrl}/en`,
        'de': `${baseUrl}/de`,
        'x-default': baseUrl,
      },
    },
  }
}

// For produkt sider med slug
export async function generateMetadata({ params }) {
  const { lang, slug } = params
  const baseUrl = 'https://example.com'

  return {
    alternates: {
      canonical: `${baseUrl}/${lang}/products/${slug}`,
      languages: {
        'da': `${baseUrl}/da/products/${slug}`,
        'en': `${baseUrl}/en/products/${slug}`,
        'de': `${baseUrl}/de/products/${slug}`,
        'x-default': `${baseUrl}/products/${slug}`,
      },
    },
  }
}

Common Mistakes

❌ Manglende self-referencing

Hver side SKAL inkludere hreflang til sig selv. Hvis /da/ ikke har hreflang="da" pointing til sig selv, ignorerer Google det.

❌ Missing return links

Hreflang skal være reciprocal. Hvis /da/ peger på /en/, skal /en/ pege tilbage på /da/.

❌ Forkerte sprog koder

Brug korrekte ISO koder. Ikke "dk" for dansk, men "da".

❌ hreflang="dk"
✓ hreflang="da"

❌ Mixed methods

Vælg ÉN metode (HTML head, HTTP header, eller sitemap). Mix ikke forskellige metoder for samme side.

Testing & Validation

Validation Tools:

Google Search Console

International Targeting report viser hreflang errors

Google Search Console →

Hreflang Tags Testing Tool

Ahrefs' gratis hreflang checker tool

Ahrefs Hreflang Tool →

Best Practices

✓ Gør dette

  • • Inkluder self-referencing hreflang
  • • Brug reciprocal hreflang links
  • • Inkluder x-default fallback
  • • Brug absolute URLs
  • • Brug korrekte ISO koder
  • • Test i Search Console

✗ Undgå dette

  • • Glem ikke self-referencing
  • • Brug ikke forkerte sprog koder
  • • Mix ikke implementation methods
  • • Point ikke til noindex sider
  • • Point ikke til redirects
  • • Ignorer ikke Search Console errors