Konfiguration der SEO für mehrsprachige Websites mit Hugo

Was tun mit `canonical`, `lang` und `hreflang`

Inhaltsverzeichnis

Übersetzen Ihrer Hugo-Website kann Ihre Google- und Bing-Rangfolge verbessern - aber nur, wenn der übersetzte Inhalt von hoher Qualität ist, lokalisiert und richtig für mehrsprachige SEO strukturiert.

Lokalisierte Seiten (nicht nur übersetzt, sondern kulturell angepasst) reduzieren oft die Absprungraten, erhöhen die Verweildauer auf der Seite und verbessern die Konversionsraten. Diese Nutzungsverhaltenssignale können sich positiv auf Ihre SEO-Rangfolge auswirken.

Viele verschiedene Länderflaggen vor einem Verwaltungsgebäude

Hugo ist ein Generator für statische Websites. Im Wesentlichen wandelt er die Markdown-Dateien in HTML-Seiten auf eine sehr konfigurierbare Weise um und ist ziemlich schnell. Für Details siehe hier Hugo Cheat Sheet. Sie sind auch herzlich eingeladen, die Liste der Hugo-bezogenen Artikel am Ende dieser Seite zu erkunden.

Hauptfrage: Sollten Sie für SEO übersetzen?

Szenario Hilft Übersetzung der SEO? Hinweise
Menschliche Übersetzung + lokalisiert + SEO-strukturiert ✅ Ja, starker Vorteil Beste Option
Hochwertige KI-Übersetzung + Bearbeitung + hreflang ✅ Potenziell Kann ranken, wenn die Qualität gut ist
Nur Auto-Übersetzung + kanonisch ❌ Nein Wird nicht ranken — nur für UX verwendet
Auto-Übersetzung + kein kanonisch oder hreflang ⚠️ Risiko Kann Duplikate-Strafen auslösen

Erforderliches HTML für Websites mit wörtlichen (automatisierten) Übersetzungen

  1. Jede Seite muss das lang-Attribut im html-Tag haben, zum Beispiel:
<html lang="de">
  1. Jede Seite muss eine Liste alternativer Links für diese Seite in anderen Sprachen enthalten, zum Beispiel beschreibt der folgende HTML-Code alternative URLs für dieselbe oder ähnliche Seite in drei Sprachen:
<link rel="alternate" hreflang="en" href="https://www.glukhov.org/post/2025/10/multi-language-website-seo-with-hugo/">
<link rel="alternate" hreflang="de" href="https://www.glukhov.org/de/post/2025/10/multi-language-website-seo-with-hugo/">
<link rel="alternate" hreflang="ru" href="https://www.glukhov.org/ru/post/2025/10/multi-language-website-seo-with-hugo/">
  1. Jede übersetzte Website-Seite muss die kanonische URL für diese Seite angeben (diejenige in der ersten oder Sprache der Originalseite), wie zum Beispiel:
<link rel="canonical" href="https://www.glukhov.org/post/2025/10/multi-language-website-seo-with-hugo/">

Dies wird Suchmaschinen anweisen, das Indizieren nicht-kanonischer Seiten zu überspringen. Einige Suchmaschinen können dies natürlich ignorieren und alle Seiten indizieren.

Für professionell / manuell übersetzte Webseite

Das Nicht-Angeben von <link rel="canonical" kann dazu führen, dass Suchmaschinen Duplikate-Strafen verhängen. Wenn Sie jedoch Ihre Website-Seiten manuell übersetzen oder eine professionelle Übersetzung in Auftrag geben, können Sie hoffen, dass Suchmaschinen Ihre nicht-kanonische Seite als Original akzeptieren.

Hugo-Vorlagen für lokalisierte Websites

Wir sollten bedenken, dass das Hugo-Website-Theme diese Funktionen möglicherweise bereits unterstützt.

<html lang=…

Öffnen Sie die Datei layouts/_default/baseof.html entweder in Ihrem Hugo-Website-Ordner oder im Ordner Ihres Themes und stellen Sie sicher, dass dort etwas wie folgt steht:

<!DOCTYPE html>
<html class="no-js" lang="{{ .Site.Language.Lang }}">
<head>
...
	{{ partial "seo-localise.html" . }}
</head>
...

Öffnen Sie nun die Datei layouts/partials/seo-localise.html und fügen Sie dort diesen HTML-Vorlagencode ein:

{{ $defaultLang := .Site.Params.defaultContentLanguage | default "en" }}
{{ $canonical := .Permalink }}

{{ if .IsTranslated }}
  {{ $original := .Translations.GetByLang $defaultLang }}
  {{ if $original }}
    {{ $canonical = $original.Permalink }}
  {{ end }}

{{ end }}

<!-- Canonical URL -->
<link rel="canonical" href="{{ $canonical }}">

<!-- Hreflang Alternate Tags -->
{{ range .AllTranslations }}
    <link rel="alternate" hreflang="{{ .Lang }}" href="{{ .Permalink }}">
{{ end }}

Wenn Sie Ihre Website manuell übersetzen, könnte dieser Code so aussehen:

{{ $canonical := .Permalink }}

<!-- Canonical URL -->
<link rel="canonical" href="{{ $canonical }}">

<!-- Hreflang Alternate Tags -->
{{ range .AllTranslations }}
    <link rel="alternate" hreflang="{{ .Lang }}" href="{{ .Permalink }}">
{{ end }}

config.toml

In Ihrer config.toml stellen Sie sicher, dass Sie Folgendes einstellen:

# Konfigurieren Sie Sprachen auf Ihrer Website

defaultContentLanguage = "en"

[languages]
  [languages.en]
    weight = 1
    languageName = "English"

  [languages.es]
    weight = 2
    languageName = "Español"

  [languages.fr]
    weight = 3
    languageName = "Français"

Passen Sie den obigen Code basierend auf den Sprachen Ihrer Website an.

Führen Sie nun den hugo-Befehl aus, um eine Website zu generieren, dann hugo serve, um den Entwicklungs-Webserver zu starten, öffnen Sie die Website und betrachten Sie den Quellcode einer Seite. Stellen Sie sicher, dass alle <html>- und <link>-Tags die richtigen Attribute haben.