Hreflang für internationale Seiten
Signalisieren Sie Suchmaschinen Sprach- und Regionsvarianten
Hreflang für internationale Seiten ist eine kostenlose HTML Academy-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des HTML Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der HTML Academy-Kurs umfasst insgesamt 4 Lektionen.
Das Problem, das hreflang löst
Wenn Sie denselben Artikel auf Englisch, Türkisch und Japanisch veröffentlichen, müssen Suchmaschinen wissen, welche Version sie in den Suchergebnissen des jeweiligen Nutzers anzeigen sollen. Ohne hreflang kann Google die falsche Sprache ausliefern oder die Varianten als Duplicate Content behandeln.
Das link-Tag
Deklarieren Sie jede alternative Version mit <link rel="alternate" hreflang="..." href="..."> im <head>. Das hreflang-Attribut ist ein BCP-47-Sprachcode (en, tr) oder eine Sprach-Regions-Kombination (en-US, en-GB, pt-BR).
<link rel="alternate" hreflang="en" href="https://example.com/en/article">
<link rel="alternate" hreflang="tr" href="https://example.com/tr/article">
<link rel="alternate" hreflang="ja" href="https://example.com/ja/article">Gegenseitige Verweise erforderlich
Jede Version muss auf jede andere Version verweisen, einschließlich auf sich selbst. Google ignoriert hreflang-Cluster, die nicht bidirektional sind. Die englische Seite verweist auf TR und JA, die türkische Seite auf EN und JA und so weiter.
Selbstreferenz
Jede Seite sollte über hreflang auf sich selbst verweisen. Die englische Seite muss <link rel="alternate" hreflang="en" ...> enthalten, das auf ihre eigene URL verweist. Dies gehört zur „Gegenseitigkeit“ – Google verwendet den Selbstverweis, um die Clusterzugehörigkeit zu bestätigen.
Der x-default-Wert
Verwenden Sie hreflang="x-default", um die Fallback-Seite für Nutzer anzugeben, deren Sprache Google nicht zuordnen kann. Meist verweist der Wert auf die englische Version oder eine Landingpage zur Sprachauswahl, damit auch Nutzer außerhalb der Zielgruppen auf einer sinnvollen Seite landen.
Sprachcodes und Regionscodes
en richtet sich an alle Englischsprachigen. en-US, en-GB und en-AU richten sich an Länder-Varianten, wenn sich der Inhalt je nach Region unterscheidet, etwa bei Währung, Schreibweise oder Versand. Geben Sie keine Region an, wenn sich der Inhalt nicht von der generischen Version unterscheidet.
Alternative Deklarationen
hreflang kann auch im HTTP-Link-Header für Nicht-HTML-Dateien wie PDFs oder in einer XML-Sitemap mit <xhtml:link rel="alternate" hreflang="..."> deklariert werden. Die drei Methoden sind gleichwertig. Wählen Sie die Methode, die sich am einfachsten warten lässt.
Deklaration in der Sitemap
Die Deklaration von hreflang in einer Sitemap lässt sich bei Websites mit vielen Sprachen besser skalieren als HTML-Tags: Ein Sitemap-Eintrag pro URL listet alle Alternativen auf und vermeidet doppelte Vorlagen pro Seite. Die Search Console weist auf fehlende gegenseitige Verweise hin, sodass Fehler früh sichtbar werden.
Häufige Fehler
Ein Unterstrich (en_US) statt eines Bindestrichs (en-US), ein Verweis auf eine URL ohne 200-Status, eine Mischung aus http und https im Cluster oder ein fehlender Selbstverweis machen hreflang unbemerkt unwirksam. Führen Sie nach dem Start den „International Targeting“-Bericht der Google Search Console aus.
Ersetzt keine Übersetzung
hreflang teilt Google lediglich mit, welche Übersetzung bereits vorhanden ist. Die Seiten selbst benötigen weiterhin echte übersetzte Inhalte – Google übersetzt sie nicht für Sie. Websites, die hreflang auf Seiten ausliefern, die zu 80 % auf Englisch verfasst sind, verwirren den Index unbemerkt.
Mit og:locale und lang kombinieren
Setzen Sie <html lang="..."> und og:locale auf die tatsächliche Sprache der Seite. hreflang informiert Suchmaschinen über verwandte Seiten, während lang und og:locale Browsern und sozialen Netzwerken die Sprache der aktuellen Seite mitteilen. Für ein vollständiges Bild werden beide Angaben benötigt.
Wissensfrage
Worauf verweist hreflang="x-default"?
Zusammenfassung
hreflang verknüpft übersetzte Versionen einer Seite, damit Suchmaschinen die richtige Sprache ausliefern. Verwenden Sie BCP-47-Codes, deklarieren Sie Alternativen gegenseitig einschließlich eines Selbstverweises, fügen Sie x-default als Fallback hinzu und überprüfen Sie die Angaben im „International Targeting“-Bericht der Google Search Console. Übersetzungsqualität sowie die Tags lang und og:locale müssen weiterhin übereinstimmen.
Lerne HTML mit einem KI-Tutor — kostenlos
Schreibe und führe echten Code in deinem Browser aus, bekomme sofortige Hilfe von einem 24/7 KI-Tutor und setze dein Lernen im Web oder in der App fort.
- Kurse
- 40
- Lektionen
- 159
Häufig gestellte Fragen
Ist die Lektion „Hreflang für internationale Seiten“ kostenlos?
Ja — der vollständige Text von „Hreflang für internationale Seiten“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des HTML Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der HTML Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Hreflang für internationale Seiten“?
Signalisieren Sie Suchmaschinen Sprach- und Regionsvarianten Du übst HTML Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um HTML Academy zu starten?
Keine Vorkenntnisse erforderlich. HTML Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.
Wie lange dauert die Lektion „Hreflang für internationale Seiten“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser HTML Academy-Lektion Code schreiben und ausführen?
Ja. Jede HTML Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- OpenGraph: og:title og:description og:image
- Twitter-Card-Meta-Tags
- Grundlagen strukturierter Daten mit JSON-LD
- Hreflang für internationale Seiten