SEO benefits of correctly utilized hreflang tags
Correctly implemented hreflang tags are super essential in ensuring search engine crawlers can understand the site structure of a multi-regional / multilingual website.
Avoids duplicate content penalization
Multi-regional and multilingual website's incorporate multiple versions of the same page with slight content variations and hence contain a large amount of duplicate content. By ensuring a correct hreflang tag implementation, search engine crawlers will understand the purpose of these content variants and thus will avoid any severe penalties for duplicate content.
Only relevant regional or language pages are ranked search results
By helping search engines understand which pages are targeted at which regions and languages, it can help them rank only the relevant pages in search results for the particular visitor. This results in a higher click through rate as the visitor will see only relevant search results from your website.
CONTENT
- Hreflang tags for mult-regional sites
- Hreflang tags for multilingual sites
- Hreflang tags for both multi-regional and multilingual sites
- The correct way to use hreflang attributes
- Hreflang usage with subdomains, subpages and different domains
- Default hreflang tag for global or fallback pages
- Ensuring all page variations link back to every other variation
- Adding hreflang tags in your sitemap
- Google search console setup for hreflang
- Hreflang tag generators
- Handling visitors landing on incorrect regional or language pages
- Other awesome guides to hreflang tags
- 5 Quick Tips
Hreflang tags for multi-regional websites
A multi-regional site has different pages or domains that target different countries.
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
<link rel="alternate" href="http://example.com/gb/" hreflang="en-gb" />
<link rel="alternate" href="http://example.com/au/" hreflang="en-au" />
Hreflang tags for multilingual sites
A multi-lingual site has different pages that target different languages.
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
<link rel="alternate" href="http://example.com/de/" hreflang="de" />
<link rel="alternate" href="http://example.com/fr/" hreflang="fr" />
Hreflang tags for both multi-regional & multilingual sites
Some websites incorporate both regional and language variants.
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
<link rel="alternate" href="http://example.com/de/" hreflang="de" />
<link rel="alternate" href="http://example.com/fr/" hreflang="fr" />
The correct way to use hreflang tag attributes
The hreflang tag consist of 3 attributes:
rel="alternate"
Tells the search crawler that there is an alternate variation of the page present
href="http://example.com"
Used to specify the actual alternate URL
hreflang="en-gb"
Used to specify the language and country
The first portion en specifies the language in ISO 639-1 format
The second portion gb is optional and specifies the country using the ISO 2 letter country code
Hreflang usage with subdomains, subpages and different domains
Website's serving multiple regions and languages are often split into either subpages on the same site, completely different domains or subdomains on the same domain.
Website with different country pages:
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
<link rel="alternate" href="http://example.com/gb/" hreflang="en-gb" />
<link rel="alternate" href="http://example.com/au/" hreflang="en-au" />
Website with different country domains:
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
<link rel="alternate" href="http://example.co.uk/" hreflang="en-gb" />
<link rel="alternate" href="http://example.com.au/" hreflang="en-au" />
Website with different country sub-domains:
<link rel="alternate" href="http://example.com/" hreflang="x-default" />
<link rel="alternate" href="http://uk.example.com/" hreflang="en-gb" />
<link rel="alternate" href="http://au.example.com/" hreflang="en-au" />
Default hreflang tag for global or fallback pages
The hreflang "x-default" attribute is used for specifying a page that does not have any region or language assosciated with it. This is normally used for the global pages that serve every region or language that is explicitly not specified in any other hreflang tag.
For example http://example.com may serve various countries such as Canada, USA, India etc. In such a case you are required to tag http://example.com with the x-default attribute.
Google recommends using the x-default hreflang attribute!
Ensuring all page variations link back to every other variation
Every page of your site must have hreflang tags that point to other language or region variants. Leaving them out leaves the doors open for search engine crawlers to misinterpret your site structure.
Adding hreflang tags in your sitemap
If you are unable to add hreflang tags into your website's header, you can add them to your sitemap instead. Adding hreflang tags to a sitemap requires the use of <loc> element.
You can see below, it can get quite complicating. For every page you will need to specify the variants using the <xhtml:link> element.
<url>
<loc>http://www.example.com/</loc>
<xhtml:link rel="alternate" hreflang="de" href="http://www.example.com/de/"/>
<xhtml:link rel="alternate" hreflang="fr" href="http://www.example.com/fr/"/>
</url>
<url>
<loc>http://www.example.com/de</loc>
<xhtml:link rel="alternate" hreflang="x-default" href="http://www.example.com/"/>
<xhtml:link rel="alternate" hreflang="fr" href="http://www.example.com/fr/"/>
</url>
<url>
<loc>http://www.example.com/fr</loc>
<xhtml:link rel="alternate" hreflang="x-default" href="http://www.example.com/"/>
<xhtml:link rel="alternate" hreflang="de" href="http://www.example.com/de/"/>
</url>
Google search console setup for hreflang
You will need to treat every variant as a separate property. This let's Google know that each variant is a separate site.
Hence it is important to keep in mind that the site structure is critical. Choosing the right site structure makes it easy to 'split' your site into the associated regions or languages.
Hreflang tag generators
Need to generate hreflang tags quickly?
You can use our freely available hreflang tag generator!
Handling visitors landing on incorrect regional or language pages
One of the common issues of running a site with multiple language or region variants is that, you may find visitors landing on the incorrect version.
For example, you may have a single global Facebook or Instagram page which links visitors to your global default site.
To ensure your visitors have the best experience you can make use of a geo redirect to take visitors to the correct regional or country page based on their location. This can either be done using an automatic redirection or a popup / notification bar that prompt's visitors to 'switch' to the local site.
Other awesome guides to hreflang tags
- Google Support - Tell Google about localized versions of your page
- Yoast - Ultimate Hreflang Guide
- Ahrefs - Hreflang : The Easy Guide for Beginners
- MOZ - Hreflang Tag
6 Quick Tips
- Use the correct ISO language codes and country codes
- Ensure hreflang tags are present for all variants in every page
- Use the x-default tag for unmatched languages or countries
- Don't forget to use http or https in every hreflang link
- Use a geo redirect to auto redirect or prompt the visitor to go to the correct regional page if they are found on the incorrect one. This will greatly help increase conversion rates.
- If you consider software developer vacancies, optimizing hreflang tags can broaden your website's global appeal, attracting diverse talent and enhancing user experience for potential candidates.
