Zuhause > Blog > Mehrsprachig > Hreflang-Tags: Der ultimative Leitfaden zu dem, was sie sind und wie man sie verwendet

Hreflang-Tags: Der ultimative Leitfaden zu dem, was sie sind und wie man sie verwendet

Von Colin
Letzte Aktualisierung: 2. April 2024

Wenn Sie eine mehrsprachige Website erstellen, sind Sie wahrscheinlich schon auf den Begriff gestoßen hreflang-Tags. Tatsächlich ist das wahrscheinlich der Grund, warum Sie diesen Artikel gerade lesen.

Also – was sind hreflang? Und warum sollten Sie sich um hreflang-Tags kümmern, wenn Sie mehrere Sprachen auf Ihrer Website verwenden?

Wenn Sie weiterlesen, können Sie diese Fragen beantworten, plus noch viel mehr!

In unserem vollständigen Leitfaden erfahren Sie alles, was Sie über hreflang-Tags wissen müssen, einschließlich der folgenden Punkte:

  • Was sind Hreflang-Tags?
  • Hreflang SEO Auswirkungen
  • Einige hreflang-Beispiele, wann Sie sie verwenden sollten
  • Hreflang-Implementierung, einschließlich einer einfachen Möglichkeit, Hreflang-Tags einzurichten, wenn Sie WordPress verwenden

Legen wir los!

Was sind Hreflang-Tags?

Hreflang-Tags sind kleine Code-Schnipsel im Hintergrund, die die Sprache und die geografische Region einer Seite auf Ihrer Website identifizieren.

Suchmaschinen können diese Tags verwenden, um Ihre Website zu verstehen und den Suchenden die relevantesten Inhalte zu liefern.

Genauer gesagt ermöglichen hreflang-Tags die Verknüpfung von Inhalten, sodass Suchmaschinen verstehen, dass diese Seiten miteinander verbunden sind, aber unterschiedliche Sprachen oder Regionen ansprechen.

Zum Beispiel, sagen wir, Sie haben eine Seite auf Englisch unter https://yoursite.com/hello-world/ und dann derselbe Inhalt ins Spanische übersetzt unter https://yoursite.com/es/hola-mundo/.

Mit hreflang-Tags können Sie Suchmaschinen mitteilen: “Hey, diese beiden Seiten haben den gleichen Inhalt/Zweck, aber die eine Seite ist für englischsprachige und die andere für spanischsprachige Nutzer.”.

Du kannst auch weitergehen nur Sprache und informieren Sie auch Suchmaschinen darüber, dass Ihre Seiten zu Lokalisierungszwecken auf verschiedene geografische Gebiete abzielen.

Zum Beispiel: “Hey, diese beiden Seiten haben den gleichen Inhalt und sind beide auf Englisch, aber eine ist für Leute in den USA und die andere für Leute in Großbritannien.”.

Hier ist ein Beispiel dafür, wie hreflang-Tags in Ihrem HTML auf Ihrer Website aussehen:

Hreflang tags in website HTML <head> section

Hreflang SEO-Auswirkungen und Bedeutung

Während Hreflang-Tags kein wichtiger SEO-Rankingfaktor sind, so wie es Backlinks und Keyword-Recherche sind, ist ihre korrekte Verwendung ein wichtiger Teil von On-Page-SEO für mehrsprachige Websites oder Standorte mit mehreren Niederlassungen.

Es gibt drei Haupt SEO-Vorteile der Verwendung von hreflang-Tags.

1. Vermeiden von Problemen mit doppeltem Inhalt

Das erste ist, dass hreflang hilft, Probleme mit doppeltem Inhalt auf Ihrer Website zu vermeiden. Nehmen wir zum Beispiel an, Sie haben zwei fast identische Seiten mit Inhalten, wobei eine englischsprachige Personen in den USA und die andere englischsprachige Personen in Australien anspricht.

Durch das Hinzufügen des relevanten hreflang-Tags für Sprache und Gebietsschema können Sie Suchmaschinen klar machen, dass es sich bei diesen Seiten nicht um doppelten Inhalt handelt, sondern dass sie für unterschiedliche Zielgruppen optimiert sind.

2. Seiten für verschiedene Suchzielgruppen optimieren

Fahren wir mit dem obigen Beispiel fort. Durch das Hinzufügen des hreflang-Tags zu Ihren Inhalten, die für die USA und Australien bestimmt sind, vermeiden Sie nicht nur Probleme mit doppeltem Inhalt, sondern stellen auch sicher, dass alle Suchanfragen zu den für sie optimierten Inhalten weitergeleitet werden.

Grundsätzlich kann Google die US-Version für Personen ranken, die in den USA suchen, und die australische Version für Personen, die in Australien suchen.

Jeder Nutzer gelangt auf die für ihn optimierte Seite, was auch einige zusätzliche tertiäre SEO-Vorteile mit sich bringen kann, wie eine höhere CTR, eine niedrigere Absprungrate usw.

3. Profitieren Sie von gemeinsamen Ranking-Signalen

In einem Q&A 2017 Mit Gary Illyes von Google deutet Gary an, dass hreflang-Tags auch direktere Auswirkungen auf SEO haben können, da Seiten, die alle zum selben hreflang-Cluster gehören, bis zu einem gewissen Grad ihre Ranking-Signale untereinander teilen werden.

Zum Beispiel können Links, die auf die englischsprachige Version einer Seite verweisen, auch einen positiven Einfluss auf die spanischsprachige Version haben (sofern beide Seiten mit hreflang gruppiert sind).

Wir wissen nicht, wie viel geteilt wird, und es ist unwahrscheinlich, dass Sie den vollen “Link Juice” erhalten, um es so zu sagen. Aber selbst ein kleiner Schub durch geteilte Ranking-Signale ist die Zeit wert, die Sie für die ordnungsgemäße Einrichtung von hreflang-Tags aufwenden.

Ist Hreflang gut für SEO?

Zusammenfassend lässt sich sagen, dass die korrekte Verwendung des hreflang-Tags gut für die SEO ist, da es Ihnen hilft, die Indexierung Ihrer Website durch Suchmaschinen zu optimieren und das bestmögliche Erlebnis für Suchende zu schaffen.

Google hat auch angedeutet, dass es direktere Vorteile geben könnte, wie zum Beispiel Seiten, die im selben hreflang-Cluster Ranking-Signale teilen.

Ein echtes Hreflang-Beispiel: Drei gängige Situationen

Wir haben dies im vorherigen Abschnitt bereits kurz angesprochen, aber lassen Sie uns einige Beispiele durchgehen, wann Sie das hreflang-Tag auf Ihrer Website verwenden möchten.

Inhalte in verschiedenen Sprachen

Wenn Sie Inhalte auf Ihrer Website haben, die Sie in mehrere Sprachen übersetzt, möchten Sie die hreflang-Anweisung hinzufügen, damit Google weiß, dass diese Seiten miteinander verknüpft sind. Das heißt, es ist dieselbe Version der Seite, nur in verschiedenen Sprachen.

Inhalt in derselben Sprache, aber für verschiedene Lokalisierungen

Wie wir im SEO-Abschnitt besprochen haben, möchten Sie möglicherweise immer noch das hreflang-Tag verwenden, auch wenn Ihre Inhalte in der gleichen Sprache sind. Wenn Sie beispielsweise unterschiedliche Versionen einer Seite für englischsprachige Besucher aus den USA, Großbritannien und Australien haben, möchten Sie hreflang-Tags verwenden, um Folgendes anzugeben: das Gebietsschema jeder Seite.

Sie fragen sich vielleicht, warum hreflang-Tags für identische Inhalte über verschiedene Lokalisierungen hinweg implementiert werden.

Abgesehen von den SEO-Vorteilen, die wir durch die Implementierung von Hreflang-Tags besprochen haben, können Websites sicherstellen, dass Benutzer basierend auf ihrem Standort zur relevantesten Version einer Seite weitergeleitet werden.

Dies ist besonders wichtig für E-Commerce-Websites, da es ihnen ermöglicht, Preise in der lokalen Währung anzuzeigen, auf lokale Kaufgewohnheiten einzugehen und ein personalisierteres Benutzererlebnis zu bieten. Das Verständnis der Währung und Gewohnheiten von Nutzern in verschiedenen Regionen ermöglicht es Unternehmen, ihre Angebote, Werbeaktionen und Inhalte so anzupassen, dass sie besser bei jedem Publikum ankommen, was letztendlich die Nutzerbindung erhöht und die Konversionsraten steigert.

Daher können die Einbeziehung von hreflang-Tags und die Berücksichtigung verschiedener Lokalisierungen die Sichtbarkeit, Benutzerfreundlichkeit und letztendlich den Erfolg einer Website auf globalen Märkten erheblich beeinflussen.

Inhalte auf verschiedenen Domains/Subdomains

In manchen Situationen können Sie separate mehrsprachige Websites über Subdomains oder komplett unterschiedliche Domainnamen erstellen. Zum Beispiel, yoursite.com und yoursite.es.

Sie können das hreflang-Tag weiterhin verwenden, um Ihre Websites miteinander zu verknüpfen, auch wenn sie separate Domainnamen verwenden.

Allgemeine Hreflang-Implementierungstipps

Wie Sie das hreflang-Tag zu Ihrer Website hinzufügen, hängt davon ab, wie Sie Ihre Website erstellt haben.

Haben Sie Ihre Website zum Beispiel selbst von Grund auf neu programmiert? Oder verwenden Sie ein selbst gehostetes Content-Management-System wie WordPress oder einen Website-Baukasten wie Squarespace oder Wix?

Wenn Sie WordPress verwenden, ist es sehr einfach, das hreflang-Tag mit einem Plugin wie TranslatePress.

Für gehostete Website-Baukästen ist es eine gemischte Angelegenheit. Einige Website-Baukästen fügen die hreflang-Tags automatisch für Sie hinzu, während andere verlangen, dass Sie diese manuell selbst einfügen.

Wie erstellt man einen Hreflang-Tag?

Bevor wir über die hreflang-Implementierung für bestimmte Plattformen sprechen, wollen wir darüber sprechen, wie man generell ein hreflang-Tag erstellt.

Wenn Sie ein hreflang-Tag erstellen, haben Sie zwei Optionen:

  • Nur Sprache – Sie können die Sprache der Seite nur angeben, indem Sie ihren Zwei-Buchstaben-Code hinzufügen. Zum Beispiel: “Dies ist die spanische Version der Seite”.
  • Sprache UND Gebietsschema – Sie können über die reine Sprache hinausgehen und auch einen regionalen Bezug festlegen, indem Sie sowohl den Sprachcode als auch den Ländercode hinzufügen. Zum Beispiel: “Dies ist die spanische Version der Seite für Menschen in Mexiko” und “Dies ist die spanische Version der Seite für Menschen in Spanien”.

Wenn Sie mehrere Seiten in derselben Sprache haben, die unterschiedliche Gebietsschemas anvisieren, sollten Sie beides mit dem hreflang-Tag angeben.

Wenn Sie jedoch nur eine einzige Seite in der Sprache für alle Bereiche erstellen, dann können Sie die Sprache einfach angeben.

Das grundlegende hreflang-Tag-Format sieht wie folgt aus:

<link rel="alternate" hreflang="[LANGUAGE]-[LOCALE]" href="[URL]" />

Hier ist ein hreflang-Beispiel, das angibt, dass die Seite für alle Lokalisierungen auf Englisch ist:

<link rel="alternate" hreflang="en" href="https://yoursite.com/hello-world/" />

Und hier ist ein Beispiel, das darauf hinweist, dass die Seite auf Spanisch ist und für Menschen in Mexiko:

<link rel="alternate" hreflang="es-mx" href="https://yoursite.com/es/hola-mundo/" />

Hier sind einige Notizen:

  • Land und Ländercode – für die Länder- und Gebietsschema-Codes verwenden Sie die zweibuchstabigen ISO-Codes. Alle Ländercodes. Alle Sprachcodes.
  • URL – stellen Sie sicher, die vollständige URL anzugeben, einschließlich des HTTPS- oder HTTP-Teils.

Wie viele Hreflang-Tags müssen Sie hinzufügen?

Google sagt, dass du hinzufügen musst alle hreflang-Tags zu jeder Version eines Inhalts, einschließlich der aktuellen Version.

Nehmen wir zum Beispiel an, Sie haben drei Versionen einer Seite:

  • Englisch
  • Spanischsprachige in Mexiko
  • Deutsch

Jede Version würde alle drei Tags enthalten, damit Google weiß, dass sie alle in einem Cluster verbunden sind.

Das heißt, die englische Version würde immer noch den englischen hreflang-Tag enthalten (welcher ist self-referential in technical terms), as well as the two hreflang tags for the other versions of the page.

Here’s an example of what the hreflang tags would look like for each page in the cluster:

<link rel="alternate" hreflang="en" href="https://yoursite.com/hello-world/" />
<link rel="alternate" hreflang="es-mx" href="https://yoursite.com/es/hola-mundo/" />
<link rel="alternate" hreflang="de" href="https://yoursite.com/de/hallo-welt/" />

If pages in an hreflang cluster don’t all point to one another, Google might ignore the hreflang tag, so it’s important to make sure you’re adding the hreflang tag everywhere where it’s needed.

Google also recommends that you add a “default” page for visitors who aren’t using one of the languages/locales that you’ve specified.

You can set this up using the x-default hreflang tag. Here’s an example:

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

Where Do You Put the Hreflang Tag?

There are two main places to put the hreflang tag:

  1. HTML – you add the hreflang tags in the <head> section of your site.
  2. Sitemap – you include the hreflang tags in your XML sitemap that you submit to Google and other search engines.

You can also add the hreflang tag with HTTP headers, but this is only really needed for non-HTML files such as PDFs or other documents that you’re hosting on your server.

For best results, you’ll probably want to add the hreflang tag to beide your site’s HTML and XML sitemap. This is what most automated tools do (more on those next).

Here’s a hreflang example from Moodle for adding code to the HTML <head> section of a page:

Hreflang tags in website HTML <head> section

You can see that there are hreflang tags for five different languages, plus a default option.

And here’s a hreflang example from an XML sitemap – you can see that the sitemap includes entries for all different versions in the hreflang cluster. In this case, that’s one version for English-USA and one for Spanish-Spain:

Hreflang tags in XML sitemap

Wie richte ich Hreflang für verschiedene Website-Baukasten-Tools ein

Now that we’ve covered some general tips on hreflang implementation, let’s talk about how to set up hreflang tags for specific platforms including the following:

  • WordPress
  • Squarespace
  • Wix
  • Webflow

WordPress Hreflang Guide

Before I get into the tutorial, here’s a short video that quickly explains the process of adding hreflang tags to WordPress:

If you want to add hreflang to WordPress, you can use the TranslatePress plugin.

TranslatePress offers everything that you need to create a multilingual WordPress site. It can help you translate your content manually and/or automatically via Google Translate or DeepL. Then, it will create SEO-friendly versions for each language, including automatically adding the relevant hreflang tag.

It will add the hreflang tag both in each page’s HTML, as well as in your XML sitemap von popular SEO plugins wie zum Beispiel Yoast SEO.

The hreflang tags in both of the example screenshots that we showed you in the previous section were automatically generated by TranslatePress.

To learn more, check out our guide to the WordPress hreflang tag. We also have a tutorial on how to make a multilingual WordPress site with TranslatePress.

TranslatePress Mehrsprachig

The easiest way to add proper hreflang tags to your WordPress website's HTML and sitemap.

Squarespace Hreflang Guide

Adding dynamic hreflang to Squarespace is a bit tricky because it often requires you to manually add the hreflang tag to your page via custom code.

You can generate the proper hreflang tags using this generator tool. Then, you’ll need to use Squarespace’s custom code option to add those tags to your site’s <head> section.

If you want to add the hreflang tag to your Squarespace site’s XML sitemap, that will also require some manual effort. You can use Screaming Frog to crawl your Squarespace site and generate an XML sitemap. Then, you’ll need to manually edit that sitemap to include the hreflang tags.

Unfortunately, Squarespace just doesn’t do a good job of handling multilingual sites at this time, which is why the Squarespace hreflang implementation requires manual workarounds.

If you want a smoother multilingual experience, you can consider switching to WordPress.

Wix Hreflang Guide

Compared to Squarespace, Wix offers much stronger multilingual functionality. If you use Wix’s multilingual feature to create your multilingual site, Wix will automatically add the proper hreflang tags to your pages – there’s no need for any manual effort on your part.

Webflow Hreflang Guide

Webflow uses the same general approach as Squarespace, which means you’ll be responsible for manually setting up the proper hreflang tags if you’re creating a multilingual site.

That is, you’ll need to manually add the hreflang tags to each page’s <head> section and you’ll also need to manually construct your sitemap (using a tool like Screaming Frog) if you want to include hreflang tags in your sitemap.

Beginnen Sie noch heute mit dem Hreflang-Tag

If you have eine mehrsprachige Website and/or a website that has different content for different geographic locales, it’s important to properly add the hreflang tag to your site to improve SEO and user experience.

The hreflang tag uses a simple syntax that you can add to your HTML’s <head> section and/or your XML sitemap. Just make sure to add alle of the relevant hreflang tags to each page so that search engines can clearly see how all versions of the page connect.

If you’ve built your site with WordPress, the easiest way to get started with hreflang is to use the TranslatePress plugin.

If you use TranslatePress to create a multilingual site, it will automatically add the proper hreflang tags to your site’s HTML and XML sitemap – all without you ever needing to lift a finger.

To learn more about hreflang tags on WordPress, check out our WordPress hreflang tutorial.

And to learn how to use TranslatePress, check out our guide on how to create a multilingual WordPress site.

TranslatePress Mehrsprachig

The easiest way to add proper hreflang tags to your WordPress website's HTML and sitemap.

Do you still have any questions about the hreflang tag or how to use it? Let us know in the comments!

Wenn Sie diesen Beitrag hilfreich fanden, schauen Sie sich bitte unsere an YouTube-Kanal, wo wir ständig kurze und leicht verständliche Video-Tutorials hochladen. Sie können uns auch folgen auf Facebook und Twitter um der Erste zu sein, der jedes Mal Bescheid weiß, wenn wir etwas posten.