When should you use the Hreflang tag?
You have problems with duplicate content, because the contents of your German, Swiss and Austrian pages are often identical? Here the Hreflang tag helps. We explain what this tag can do, how to install it and what advantages the Hreflang tag brings with it.
If you run a multilingual and/or multiregional website, you should use the Hreflang tag. It helps you in two ways:
It avoids duplicate content.
It shows Google which version belongs to which language and country.
You probably have the same content translated into different languages or even the same content for your German, Austrian and Swiss website versions. Here you need to be especially careful of duplicate content and be very specific about which version is relevant for which region.
In this article
International Website with WEVENTURE
What is a Hreflang Tag?
This tag distinguishes different versions of a given web page. The tag should be used on every relevant subpage. For example, if you have a product detail page that exists in three versions for Germany, Austria, and Switzerland, it’s worth tagging all three. This way you show Google which page is relevant in which region, and at best rank with the correct version (including correct currency and delivery time) in all three countries.
Even if your site is multilingual, this award is worth it, especially if your site has been translated one-to-one.
In our example (language German), the tag would look like this:
<link rel=”alternate” hreflang=”de-de”
href=”https://beispiel.com/de/produkt-1” />
<link rel=”alternate” hreflang=”de-at”
href=”https://beispiel.com/at/produkt-1” />
<link rel=”alternate” hreflang=”de-ch”
href=”https://beispiel.com/ch/produkt-1” />
The abbreviations in the Hreflang stand for the language and the region, in our example thus:
- de-de: German content for users from Germany
- de-at: German content for users from Austria
- de-ch: German content for users from Switzerland
It is important that the hreflang tag must also be self-referencing. So on the page example.com/de/product-1 this URL must also be specified for users from Germany (de-de).
Hreflang vs Canonical
If you still want to be in the index and rank with all three example pages, then the canonical solution unfortunately doesn’t work. With a canonical you show Google that a page is only a duplicate of another page. Therefore only the original will rank. So in our case it is rather suboptimal, because we still want to rank with the Swiss page in Switzerland, with the German page in Germany and with the Austrian page in Austria.
Optimize your Website now
How do I create the Hreflang tag correctly?
There are several generators online. Of course, you can also create the tags yourself according to the example above and use a country code list for help. For this, there are Hreflang checks with which you can check your code.
Hreflang x-default
Of course, it would be difficult and unnecessary to cover all countries and languages of this world by hreflang tag. For all cases that are not covered, the x-default is responsible. In our example it would look like this:
<link rel=”alternate” hreflang=”x-default”
href=”https://beispiel.com/de/produkt-1/” >
So here, all visitors who cannot be localized in Germany, Austria or Switzerland will be referred to the German page (de).
Where is the tag installed?
1. HTML link element in the header
In this variant, the tags are built into the header of each individual subpage as shown in the example above:
<link rel=”alternate” hreflang=”de-de”
href=”https://beispiel.com/de/produkt-1” />
<link rel=”alternate” hreflang=”de-at”
href=”https://beispiel.com/at/produkt-1” />
<link rel=”alternate” hreflang=”de-ch”
href=”https://beispiel.com/ch/produkt-1” />
2. Hreflang in xml sitemap
This variant is a good choice for websites that have a large number of regional versions of a web page. Putting the tags on each individual subpage would be a monumental task and a lot of code. Instead, an element is created in the sitemap for each URL with a loc tag and xhtml:links:
<?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://beispiel.com/de/produkt-1/</loc>
<xhtml:link rel=”alternate” hreflang=”de-ch”
href=”https://beispiel.com/ch/produkt-1″ />
<xhtml:link rel=”alternate” hreflang=”de-at”
href=”https://beispiel.com/at/produkt-1″ />
<xhtml:link rel=”alternate” hreflang=”de-de”
href=”https://beispiel.com/de/produkt-1″” />
</url>
<url>
<loc>https://beispiel.com/de/produkt-2/</loc>
<xhtml:link rel=”alternate” hreflang=”de-ch”
href=”https://beispiel.com/ch/produkt-2″ />
<xhtml:link rel=”alternate” hreflang=”de-at”
href=”https://beispiel.com/at/produkt-2″ />
<xhtml:link rel=”alternate” hreflang=”de-de”
href=”https://beispiel.com/de/produkt-2″” />
</url>
3. Hreflang in HTTP header
This form of markup is especially suitable for documents that are not in HTML form, for example PDFs:
Link: <https://beispiel.com/de/whitepaper.pdf/>; rel=”alternate”; hreflang=”de-de”
Link: <https://beispiel.com/ch/whitepape.pdf/>; rel=”alternate”; hreflang=”de-ch”
Link: <https://beispiel.com/at/whitepaper.pdf/>; rel=”alternate”; hreflang=”de-at”
Common mistakes with hreflang
Self-Referral
The self-referencing Hreflang tag is not used. So only the other language versions are indicated, but not the one that is currently being viewed.
Example:
On the page for users from Germany only the following Hreflang tags are specified:
Zielseite: https://beispiel.com/de/produkt-1
<link rel=”alternate” hreflang=”de-at”
href=”https://beispiel.com/at/produkt-1” />
<link rel=”alternate” hreflang=”de-ch”
href=”https://beispiel.com/ch/produkt-1” />
This forgets the self-referencing tag:
<link rel=”alternate” hreflang=”de-de”
href=”https://beispiel.com/de/produkt-1” />
All tags must always be specified here!
Relative URLs
Instead of the entire URL, only relative URLs are specified. Example:
Target page: https://beispiel.com/de/produkt-1
<link rel=”alternate” hreflang=”de-at”
href=”/at/produkt-1” />
<link rel=”alternate” hreflang=”de-ch”
href=”/ch/produkt-1” />
<link rel=”alternate” hreflang=”de-de”
href=”/de/produkt-1” />
So here the “https://beispiel.com” is always missing at the beginning of each URL. The entire URL must always be specified.
Region and language are swapped
It often happens that the ISO codes, i.e. the abbreviations for region and language, are accidentally swapped.
Example:
Instead of hreflang=”de-at” hreflang=”at-de” is specified. Here the rule is: first the language, then the region.
ISO codes are not used correctly
- Even the abbreviations are not always as one would think at first glance. For example, although Great Britain is usually translated as “United Kingdom”, the abbreviation for it is “GB” (i.e. Great Britain). It is therefore always advisable to look up the ISO codes.
We boost your digital visibility
We support you to grow your digital awareness. Let us consult you on your potential today.
Conclusion
FAQ zu hreflang
Is upper and lower cases of ISO codes relevant??
No, with the codes it doesn’t matter if you apply upper or lower case. So it doesn’t matter if the tag is hreflang=”de-AT” or hreflang=”de-at”.
Can I apply the Hreflang tag across different domains, i.e. “cross domain”?
Yes, this is possible without any problems. It doesn’t matter if you use top level domains (example.de), subdomains (example.com) or directories (example.com/en/), the principle is always the same. In concrete terms, a cross domain example would look like this:
Zielseite: https://beispiel.de/produkt-1
<link rel=”alternate” hreflang=”en-gb”
href=”https://example.com/product-1”
<link rel=”alternate” hreflang=”fr-fr”
href=”https://example.fr/produit-1” />
<link rel=”alternate” hreflang=”de-de”
href=”https://beispiel.de/produkt-1” />Jede Sprachversion verweist dabei auf die anderen Varianten – dieses Prinzip nennt man „wechselseitige Referenzierung“. Nur so erkennt Google korrekt, welche Seiten zusammengehören.
