Hreflang und Canonical Tags: Der einzige Leitfaden, den Sie jemals brauchen werden

Veröffentlicht: 2024-02-22

Hreflang-Tags und kanonische Tags sind Indikatoren für Google und andere Suchmaschinen, welche Webseiten indexiert und bestimmten Suchenden angezeigt werden sollen. Beides sind wichtige Faktoren für mehrsprachiges SEO.

Allerdings haben die beiden Arten von Tags unterschiedliche Funktionen. Deshalb ist es wichtig, sie nicht zu verwechseln oder austauschbar zu verwenden. Andernfalls könnte es zu unbeabsichtigten Folgen und schlechten Ergebnissen für Ihre Website kommen.

Um dies zu vermeiden, werden wir uns in diesem Beitrag eingehend mit Hreflang und Canonical-Tags befassen. Wir werden darüber sprechen, was sie sind, Best Practices und häufige Fehler bei ihrer Verwendung und wie man sie sowohl manuell als auch mithilfe von WordPress-Plugins richtig einrichtet.

Was sind Hreflang- und Canonical-Tags (und warum sind sie wichtig?)

Um dieses Thema besser zu verstehen, definieren wir zunächst die beiden Arten von Tags.

hreflang-Tags erklärt

Hreflang-Tags sind Code-Snippets, die Google 2011 eingeführt hat, um internationale Websites zu unterstützen. Ihre Funktion besteht darin, Suchcrawlern die Sprache und den geografischen Standort mitzuteilen, für die eine Webseite bestimmt ist. So sieht beispielsweise ein auf Französisch und die Schweiz ausgerichtetes Hreflang-Tag aus.

 <link rel="alternate" href="https://yoursite.com/ch" hreflang="fr-ch" />

Es besteht aus zwei Teilen: dem rel="alternate" , der besagt, dass es sich um eine alternative Version zu einer bestehenden Webseite handelt, und dem hreflang="fr-ch" -Teil, der ihr Ziel angibt. fr steht für die Sprache und ch für das Land, basierend auf den ISO-Sprach- und Ländercodes.

Dies ist insbesondere für internationale Websites von Bedeutung, deren Seiten möglicherweise praktisch den gleichen Inhalt haben, aber auf unterschiedliche Sprachmärkte ausgerichtet sind. Mit Hreflang-Tags können Sie Suchmaschinen signalisieren, dass Sie über lokalisierte Versionen für Suchende aus diesen Märkten verfügen.

Darüber hinaus können Sie nicht nur auf eine andere Sprache, sondern auch auf ein bestimmtes Gebietsschema abzielen. Obwohl es beispielsweise mehrere spanischsprachige Länder auf der Welt gibt, unterscheiden sie sich trotz der gemeinsamen Sprache in Dialekt, Kultur und Verbrauchergeschmack.

Mithilfe von Hreflang-Attributen ist es möglich, Webseiten für jeden Markt zu erstellen und diese entsprechend zu kennzeichnen. Auf diese Weise können Sie sie für die Zielgruppe lokalisieren, für die sie bestimmt sind, und dabei immer noch dieselbe Sprache verwenden.

Lokalisierte Bilder mit Textbeispiel Burger King Mexiko

Kanonische Tags auf den Punkt gebracht

Canonical-Tags erfüllen eine ähnliche Rolle wie Hreflang-Tags. Es handelt sich außerdem um HTML-Snippets, die Suchmaschinen signalisieren, welche URL für Suchende am relevantesten ist. So sehen sie aus:

 <link rel="canonical" href="https://yoursite.com" />

Anstatt jedoch zwischen Sprachvarianten zu unterscheiden, zeigen kanonische Tags an, dass eine Webseite als offizielle Version oder Masterkopie unter Seiten mit demselben oder sehr ähnlichem Inhalt zu betrachten ist.

Warum sollten Sie auf mehreren Webseiten denselben Inhalt haben? Es gibt verschiedene Gründe:

  • Auf einer Seite steht http:// davor, auf der anderen Seite https://
  • Sie veröffentlichen einen Artikel erneut, der bereits auf einer anderen Website vorhanden ist (natürlich mit Genehmigung). Oder Sie veröffentlichen denselben Inhalt auf einer anderen Plattform wie Medium, um mehr Reichweite zu erzielen.
  • Parameter in der URL, die kleine Änderungen auf einer Webseite signalisieren, wie z. B. Filter auf E-Commerce-Websites (z. B. https://www.yourwebsite.com/Camping-Hiking/b?ie=UTF8&node=16435151 )

In all diesen Fällen kann ein Canonical-Tag Suchmaschinen darüber informieren, was sie als Hauptversion der betreffenden Seite betrachten und diese anstelle der anderen indizieren sollten.

SEO-Vorteile von hreflang und Canonical Tags

Warum sollten Sie sich die Mühe machen, diese Tags zu Ihrer Website hinzuzufügen? Denn sie bieten zahlreiche SEO-Vorteile:

  • Vermeiden Sie Probleme mit doppelten Inhalten – Durch die ausdrückliche Kennzeichnung Ihrer Inhalte wird verhindert, dass Suchmaschinen Ihre Seiten als Duplikate betrachten. Auf diese Weise ist es weniger wahrscheinlich, dass sie Suchenden die falsche URL anzeigen oder Sie für minderwertige Inhalte bestrafen.
  • Ranking-Signale übertragen – Autorität von eingehenden Links und anderen Ranking-Signalen wird an die kanonische Seite weitergeleitet und von allen Sprachversionen geteilt.
  • Verbessertes Benutzerengagement – ​​Besucher zur richtigen Version Ihrer Seiten weiterzuleiten, z. B. in der von ihnen bevorzugten Sprache, ist gut für Conversions, Verweildauer, Benutzerengagement usw. All dies sind Dinge, die sich theoretisch positiv auf das Suchranking auswirken.
  • Vermeiden Sie die Verschwendung von Crawling-Zeit – Mit kanonischen Tags können Sie verhindern, dass Suchmaschinen bestimmte Seiten indizieren. Das bedeutet, dass das Crawling-Budget nicht für unwichtige Inhalte verschwendet wird, anstatt für die Inhalte, die Sie indizieren möchten.

Es ist wichtig zu wissen, dass es sich bei diesen Tags um Signale und nicht um verbindliche Anweisungen handelt. Sie verwenden sie, um Suchmaschinen aufzufordern, etwas zu tun (sehr bitte), aber es liegt an ihnen und ihrem Algorithmus, Ihrer Anfrage nachzukommen.

hreflang und kanonische Tags: Best Practices und häufige Fehler

Nachdem wir nun wissen, was diese Tags sind, wollen wir uns ansehen, wie man sie richtig verwendet.

Platzieren Sie sie an den richtigen Orten

Ihre erste Frage ist höchstwahrscheinlich, wo diese Links erscheinen sollen. Die hreflang- und Canonical-Tags sind üblicherweise im Abschnitt <head> des HTML-Markups einer Webseite enthalten.

Hreflang-Tags im Kopfbereich der HTML-Seite

Tatsächlich ist dies für kanonische Tags die einzige Option. Ihre Hreflang-Cousins ​​können auch in HTTP-Headern oder einer XML-Sitemap erscheinen. Im Folgenden besprechen wir ausführlich, wie Sie sie dorthin bringen.

Formatieren Sie Ihre Tags richtig

Eines der wichtigsten Dinge, die Sie wissen sollten, ist, dass die beiden Tags nicht kombiniert werden können. So etwas wie das folgende Beispiel wird von Suchmaschinen nicht verstanden.

 <link rel="canonical" rel="alternate" href="https://yoursite.com" hreflang="fr-ch" />

Stattdessen müssen Sie beide Arten von Tags separat anzeigen, etwa so:

 <link rel="alternate" href="https://yoursite.com" hreflang="fr-ch" /> <link rel="canonical" href="https://yoursite.com" />

Von den beiden Signalen sind kanonische Tags am einfachsten zu implementieren. Es muss im Grunde nur rel="canonical" sowie das Ziel enthalten.

Hreflang-Tags sind etwas launischer. Hier ist zunächst zu beachten, dass Sie nicht unbedingt sowohl einen Sprach- als auch einen Ländercode angeben müssen. Nur die Sprache reicht. Auf diese Weise können Sie eher eine Sammelseite für Personen aus der ganzen Welt einrichten, die darin suchen.

Gleichzeitig können Sie durch die Verwendung eines Ländercodes ganz gezielt zielgerichtete Seiten erstellen. Darüber haben wir oben bereits im Zusammenhang mit Spanisch gesprochen. Wichtig: Wenn Sie einen Regionalcode verwenden, stellen Sie sicher, dass dieser an zweiter Stelle und nicht an erster Stelle im hreflang-Tag steht. Überprüfen Sie auch die korrekten Sprach- und Ländercodes.

Beachten Sie gleichzeitig, dass alternative Sprachversionen nicht auf derselben Domain liegen müssen. Wenn Sie für Ihre verschiedenen Sprachversionen separate Webadressen verwenden, können Sie dennoch mit hreflang verdeutlichen, dass sie zusammengehören.

 <link rel="alternate" href="https://yoursite.com" hreflang="en-us" /> <link rel="alternate" href="https://yoursite.br" hreflang="pt-br" />

Darüber hinaus sollten Sie bei beiden Tag-Typen die vollständigen URLs Ihrer Seiten angeben, keine relativen. Hier ist der Unterschied:

  • Vollständige URL: https://yoursite.com/shop/pants
  • Relative URL: /shop/pants

Durch die Verwendung absoluter URLs machen Sie absolut klar, welche Seiten Sie meinen, und vermeiden Unklarheiten und Fehler. Wenn Sie Schwierigkeiten mit der Erstellung Ihrer Tags haben, können Sie auch einen Hreflang-Tag-Generator oder einen Canonical-Tag-Generator verwenden.

Hreflang-Tag-Generator-Tool

Machen Sie sie bidirektional und selbstreferenziell

Der nächste wichtige Punkt ist, auf welchen Seiten Sie Ihre Tags platzieren sollen. Beginnen wir mit den Hreflang-Tags.

Ein wichtiger Teil hierbei ist, dass alle Sprachversionen über Hreflang-Verweise auf jede verfügbare Alternative verfügen müssen . Anders ausgedrückt: Alle Ihre Seiten müssen aufeinander verweisen. Wenn dies nicht der Fall ist und ein Hreflang-Tag nur in eine Richtung geht, wird es von Google ignoriert.

Wenn Sie beispielsweise eine Seite in Englisch, Spanisch und Französisch haben, die auf die USA, Kanada, Spanien, Kolumbien und Frankreich ausgerichtet ist, würden Ihre Hreflang-Tags so aussehen:

 <link rel="alternate" href="https://yoursite.com" hreflang="en-us" /> <link rel="alternate" href="https://yoursite.com/uk" hreflang="en-gb" /> <link rel="alternate" href="https://yoursite.es" hreflang="es-es" /> <link rel="alternate" href="https://yoursite.es/col" hreflang="es-co" /> <link rel="alternate" href="https://yoursite.fr" hreflang="fr-fr" />

Dieser genaue Code muss zu jeder der darin genannten Seiten gehen.

Dies ist wichtig, da dadurch eine Beziehung zwischen diesen Seiten hergestellt wird und Google weiß, dass es sich um mehrere Versionen desselben Inhalts in verschiedenen Sprachen und für verschiedene Benutzergruppen handelt.

Das bedeutet auch, dass ein Hreflang-Tag immer auf die Seite verweist, auf der es erscheint. Dies wird als „Selbstreferenzierung“ bezeichnet und ist eine bewährte Vorgehensweise sowohl für Hreflang- als auch für Canonical-Tags.

Ein Canonical-Tag auf einer Webseite, das auf sich selbst verweist, ist ein Signal dafür, dass es sich um die offizielle Version handelt. Es verstärkt die Botschaft von Tags, die von anderen Standorten auf dieselbe Seite verweisen. Wenn beispielsweise Seite A die Hauptseite und Seite B ein Duplikat ist, hätten beide unten dasselbe kanonische Tag.

 <link rel="canonical" href="https://yoursite.com/page-a" />

Vermeiden Sie widersprüchliche Aussagen

Es ist wirklich wichtig, die richtigen URLs sowohl für hreflang- als auch für kanonische Tags auszuwählen, insbesondere wenn Sie sie zusammen verwenden. Denn obwohl sie in ihrer Funktion ähnlich sind, ist das, was sie Suchmaschinen signalisieren, ganz unterschiedlich.

Hreflang-Tags sind inklusive, während kanonische Tags exklusiv sind. Der erste sagt: „Indizieren Sie mich und die andere Seite, aber für unterschiedliche Gebietsschemata“, während der zweite sagt: „Indizieren Sie mich nicht, indizieren Sie die andere Seite“.

Wenn Sie also eine Seite mit Hreflang-Tags haben, die auch ein kanonisches Tag hat, das auf eine andere Stelle als sich selbst zeigt, würde dies zu zwei sehr verwirrenden Aussagen führen. Im Grunde heißt es: „Indizieren Sie mich und diese andere Seite und indizieren Sie mich nicht, sondern indizieren Sie stattdessen die andere Seite.“

In diesem Fall könnten Suchmaschinen eigene Entscheidungen treffen, die möglicherweise nicht Ihren Wünschen entsprechen. Seien Sie also wirklich vorsichtig. Abgesehen davon spielt die Reihenfolge der tatsächlichen Tags keine Rolle, solange sie vorhanden und korrekt sind.

Verwendung von hreflang=“x-default“

Abschließend ist hier noch das x-default-Tag zu erwähnen. Damit können Sie eine Standardseite für verschiedene Sprachversionen festlegen. Wenn Sie dies tun, greifen Suchmaschinen darauf zurück, wenn es keine spezifischere Version für die Sprache und/oder das Gebietsschema eines Suchenden gibt.

Dadurch können Sie auch eine bevorzugte Version festlegen, wenn Sie Seiten in derselben Sprache, aber für unterschiedliche Gebietsschemata (z. B. US- und UK-Englisch) haben. Dies ist hilfreich, wenn jemand in dieser Sprache sucht, sich aber nicht in einem der beiden Gebietsschemas befindet.

So sieht das x-default-Tag aus:

 <link rel="alternate" href="https://yoursite.com" hreflang="x-default" />

Beachten Sie, dass es keine Sprach- oder Gebietsschemainformationen enthält. Außerdem ist die Verwendung des x-default-Tags nicht zwingend erforderlich, sondern bewährt.

So richten Sie hreflang und Canonical-Tags manuell ein

Wenn Sie bisher mitgehalten haben, sollten Sie theoretisch bereit sein, Hreflang- und Canonical-Tags auf Ihrer eigenen Website zu implementieren.

Bleibt nur noch die Frage: Wie macht man das?

Lassen Sie uns das jetzt durchgehen und beginnen mit der manuellen Vorgehensweise. Hier haben Sie grundsätzlich zwei Möglichkeiten, diese zu platzieren:

  • Der oben erwähnte HTML- <head> -Abschnitt
  • Die XML-Sitemap Ihrer Website

(Eine weitere Option sind HTTP-Header, diese sind jedoch nur für Inhalte wie PDF-Dokumente wichtig.)

Verwendung des Abschnitts <head>

Diese Option eignet sich am besten für kleine Websites mit wenigen und überwiegend statischen Seiten, auf denen Sie die HTML-Dateien direkt bearbeiten. Für größere Websites, die dynamisch erstellt werden (wie in WordPress), ist dies nicht sehr praktisch.

Nachdem Sie Ihre Tags mithilfe der oben genannten Tipps und/oder Generatoren erstellt haben, öffnen Sie Ihre HTML-Dateien mit einem Code-Editor, kopieren Sie sie und fügen Sie sie zwischen den Tags <head> und </head> ein, vorzugsweise nach oben.

Hreflang-Tags im HTML-Dokument

Speichern und fertig. Wenn Sie Zweifel haben oder nicht zu funktionieren scheinen, lassen Sie Ihre Seiten durch einen HTML-Validator laufen.

Diese Methode ist relativ einfach, kann jedoch auch ärgerlich sein, wenn Sie jemals Änderungen an der Struktur Ihrer Website oder an den URLs vornehmen. In diesem Fall müssten Sie jede Seite noch einmal einzeln bearbeiten.

Einbinden von Hreflang-Tags in die Sitemap

Wenn Sie Ihre Tags manuell implementieren, ist die Sitemap möglicherweise die beste Wahl. Damit können Sie alle Änderungen an einem Ort vornehmen, was einfacher zu verwalten ist, wenn URL-Änderungen vorgenommen werden oder einfach neue Sprachversionen hinzugefügt werden müssen. Das Format sieht so aus:

 <url> <loc>https://yoursite.com</loc> <xhtml:link rel="alternate" hreflang="en-us" href="https://yoursite.com" /> <xhtml:link rel="alternate" hreflang="en-gb" href="https://yoursite.com/uk" /> <xhtml:link rel="alternate" hreflang="es-es" href="https://yoursite.es" /> <xhtml:link rel="alternate" hreflang="es-co" href="https://yoursite.es/col" /> <xhtml:link rel="alternate" hreflang="fr-fr" href="https://yoursite.fr" /> </url>

Jede Seite mit unterschiedlichen Sprachversionen muss in <url> -Klammern eingeschlossen werden. Das <loc> -Element oben definiert die ursprüngliche URL, während das <xhtml: link> -Element jede Sprachalternative definiert. Es verwendet grundsätzlich dasselbe Format wie die HTML-Version.

Auch hier können Sie zur Erstellung der Hreflang-Tags die oben genannten Generator-Tools nutzen. Wie bereits erläutert, müssen kanonische Tags im Abschnitt <head> stehen, Sie können sie nicht in der Sitemap definieren. Wenn Sie schließlich nicht wissen, wie Sie zunächst eine XML-Sitemap für Ihre Website erstellen, hat Google eine Erklärung.

Implementieren von Tags mithilfe von WordPress-Plugins

Wir können wahrscheinlich zustimmen, dass die oben genannten Methoden etwas zeitaufwändig erscheinen. Wenn Sie eine auf WordPress basierende Website betreiben, ist die Verwendung von Plugins eine einfachere Möglichkeit, Hreflang und Canonical-Tags zu implementieren.

Für kanonische Tags können Sie ein SEO-Plugin verwenden. Fast alle verfügen über Optionen zum Definieren kanonischer URLs und zum automatischen Generieren kanonischer Tags.

Legen Sie die kanonische URL in Yoast SEO fest

Beispielsweise fügt Yoast SEO allen Ihren Seiten standardmäßig selbstreferenzielle Canonical-Tags hinzu.

Andererseits ist TranslatePress eine großartige Option zur Implementierung von Hreflang-Tags.

Warum das?

Weil das Plugin das buchstäblich für Sie erledigt. Sie müssen lediglich unter Einstellungen → TranslatePress konfigurieren, welche Sprachen Sie zu Ihrer Website hinzufügen möchten.

Zielsprache in den Einstellungen aktiv

Sobald Sie dies getan und Ihre Auswahl gespeichert haben, kümmert sich TranslatePress um den Rest. Es fügt dem HTML aller Sprachversionen Ihrer Webseiten sowie Ihrer XML-Sitemap relevante Hreflang-Tags hinzu.

Translatepress-Hreflang-Tags im Kopfbereich

Darüber hinaus kann TranslatePress zwischen regionalen Versionen von Sprachen unterscheiden, beispielsweise brasilianischem Portugiesisch, mexikanischem Spanisch oder Schweizer Französisch. Wenn Sie die entsprechenden Optionen in den Einstellungen auswählen, werden Ihre Hreflang-Tags so eingerichtet, dass sie sowohl die Sprache als auch das Gebietsschema widerspiegeln.

Weitere Vorteile von TranslatePress

Wenn Ihnen das oben Genannte gefällt, könnte es Sie interessieren, was TranslatePress sonst noch zu bieten hat. Es eignet sich nicht nur für Hreflang-Tags, sondern verfügt auch über viele weitere Funktionen, die es zu einer perfekten Lösung für die Erstellung internationaler und mehrsprachiger Websites machen.

Da wäre zunächst die supereinfache Übersetzungsoberfläche.

Die Hauptübersetzungsoberfläche von Translatepress

Verwenden Sie die Vorschau rechts, um auf Ihrer Website zu navigieren und den zu übersetzenden Text direkt vom Bildschirm oder aus der Liste in der oberen linken Ecke auszuwählen.

Wählen Sie den zu übersetzenden Inhalt in TranslatePress aus

Fügen Sie dann die Übersetzung in das entsprechende Feld ein und speichern Sie.

Übersetzen Sie die Zeichenfolge in der Translatepress-Schnittstelle

Anschließend erscheint der übersetzte Inhalt automatisch auf Ihrer Website, wo Besucher mithilfe des integrierten Sprachumschalters ihre bevorzugte Sprache auswählen können.

Translatepress-Sprachumschalter

Das ist es. Mit der gleichen Methode können Sie auch sprachspezifische Bilder anzeigen und zur Beschleunigung die automatische maschinelle Übersetzung über Google Translate verwenden.

Dies alles ist Teil des kostenlosen Plugins, mit dem Sie Ihrer Website eine zusätzliche Sprache hinzufügen können. Wenn Sie mehr als das wollen, gibt es TranslatePress Pro, das außerdem über diese zusätzlichen Funktionen verfügt:

  • Automatische Übersetzung mit DeepL – Verwenden Sie anstelle von Google Translate die genauere DeepL-Übersetzungssoftware.
  • Mehrsprachiges SEO-Paket – Übersetzen Sie andere wichtige SEO-Marker wie URL-Slugs, SEO-Titel, Meta-Beschreibungen, ALT-Tags und mehr.
  • Benutzersprachspezifische Navigation – Zeigen Sie je nach Sprache Ihrer Besucher unterschiedliche Menüs an.
  • Automatische Erkennung der Benutzersprache – Leiten Sie Besucher automatisch zu ihrer bevorzugten Sprachversion um (über Browsereinstellungen oder Standort).
  • Übersetzerkonten – Erleichtern Sie die Zusammenarbeit mit Übersetzungsagenturen und Freiberuflern, indem Sie ihnen direkten Zugriff auf Ihre Website gewähren.
  • Als Benutzerrolle durchsuchen – Betrachten Sie Ihre Website als eine bestimmte Benutzerrolle im Übersetzungseditor.

TranslatePress Pro wird mit drei verschiedenen Preisplänen geliefert, sodass Sie einen auswählen können, der Ihren Anforderungen entspricht.

Sind Sie bereit, Hreflang und Canonical Tags zu beherrschen?

Die beiden Tags, über die wir in diesem Beitrag gesprochen haben, sind nützliche Signale für Suchmaschinen, wie sie Ihre Webseiten indizieren und einordnen sollten. Mit Hreflang-Tags können Sie Seitenversionen für bestimmte Sprachen und Länder definieren. Kanonische Tags hingegen kennzeichnen die offizielle Version unter ähnlichen Inhalten.

Hier sind die wichtigsten Punkte, die Sie beachten sollten:

  • Hreflang-Tags sind inklusive, während kanonische Tags exklusiv sind
  • Fügen Sie auf jeder lokalisierten Seite Hreflang-Links zu jeder Sprachversion sowie Links zur Seite selbst ein
  • Versuchen Sie nicht, beide Tags in einer Aussage zu kombinieren
  • Bei jeder Webseite mit einem hreflang-Tag darf kein kanonischer Tag auf eine andere Stelle als auf sich selbst verweisen
  • Verwenden Sie x-default-Anweisungen, um Standard- und Fallback-Sprachversionen zu definieren

Wenn Sie zum ersten Mal etwas über diese Tags erfahren, kann es etwas beängstigend und technisch wirken. Wie Sie hoffentlich gesehen haben, sind sie jedoch nicht allzu schwer zu implementieren, insbesondere wenn Sie ein Tool wie TranslatePress haben, das dies automatisch tun kann. Es hilft Ihnen nicht nur beim Übersetzen Ihrer WordPress-Website, sondern auch beim Einrichten von Hreflang-Tags, ohne dass Sie einen Finger rühren müssen. Probieren Sie es jetzt aus!

Haben Sie Fragen zur Verwendung von Hreflang und Canonical-Tags? Bitte fragen Sie sie in den Kommentaren unten!