What is hreflang?
Hreflang tags are an SEO solution to handle websites that have pages available in multiple languages. They tell search engines about the relationship between international versions of a page, and can target both the language and the region in the same tag.
As SEOs, we want to ensure that users are seeing results for the most relevant pages, so French-speaking users should see the French language version of a result.
Having multiple variations of very similar pages across sites with regional variations of the same language can cause content duplication, for example, in the instance of having en-us pages and en-gb pages. Hreflang tags are a good method for solving these issues and making sure search engines understand the connections between these pages rather than seeing them as duplicates.
Here is an example of how the hreflang tag appears:
<link rel=”alternate” href=”https://example.com” hreflang=”en-us” />
This targets English speakers in the US.
The standard format of an hreflang tag includes a language followed by a location, e.g.:
“de-at”
Which targets German speakers in Austria.
You can also have hreflang tags that target just the language without specifying a region, e.g.:
“en”
Which targets English speakers globally.
If you have a default page version that you would like to be shown in all instances where you don’t have specific language-region targeted tags in place, you can use the x-default tag to show that the page is not specifically targeted. Here’s what the x-default hreflang tags looks like:
<link rel=”alternate” href=”https://example.com/” hreflang=”x-default” />
Hreflang tags can be implemented in three different ways: within XML sitemaps, in the HTTP response header, or within the HTML <head>. The example above shows the line of code you’d add if you were implementing hreflang into the <head>. To serve hreflang within a sitemap, you would include variant URLs for each available language as follows.
<?xml version=”1.0″ encoding=”UTF-8″?><urlset >
>
<loc>https://example.com/page.html</loc>
<xhtml:link
rel=”alternate”
hreflang=”en-US”
href=”https://us.example.com/page.html”
/>
<xhtml:link
rel=”alternate”
hreflang=”en-UK”
href=”https://uk.example.com/page.html”
/>
<xhtml:link
rel=”alternate”
hreflang=”x-default”
href=”https://example.com/page.html”
/></url><url>………….
If you have separate AMPs (Accelerated Mobile Pages), you don’t need to add hreflang tags to them. Implement hreflang on the main desktop pages and do the same for a dedicated mobile site. As long as you have canonical tags
on AMPs back to the desktop version then the hreflang will be picked up from desktop.
How does hreflang work with indexing?
Now we’ve covered what hreflang tags are, let’s go into more detail around how they are handled by search engines. Search engines will crawl each of the hreflang URLs and count them as unique pages. When hreflang is working correctly, these pages won’t be seen as duplicates. Each page will be indexed against the relevant SERP’s location and languages, and the pages will be swapped out when required.
Be mindful that alternate hreflang URLs use up crawl budget as Google will need to crawl each language variation of a set to ensure that the pages meet best practice guidelines. For example, Google will need to make sure that none of these pages include or link to spam content. This is something to be aware of if you already struggle with crawl budget and have a large number of different language variations.
How does hreflang work with search engine ranking?
Seeing as URLs in a set are simply switched out, hreflang doesn’t affect rankings. When the correct configuration is set up, search engines simply swap out the pages within the SERPs with the local or the relevant language pages you’ve identified via hreflang. For example, if you have an English language page that is ranking in the German SERPs and have an hreflang tag for a German language equivalent page, then the German page would not rank any better but would be swapped out for the German language version.
In 2016, Google Webmaster Trends Analyst John Mueller confirmed that hreflang will not help your rankings any more than not having the tags in place.
HTML Language Tags
It’s important to consider how all search engines handle internationalisation, because even though Google and Yandex support hreflang tags, Bing doesn’t. Instead, Bing supports HTML language tags which we will explain in more detail in this section of the guide.
To ensure Bing and some other services can understand the country and language of the page being indexed, you can do the following:
1. Embed metadata into the document using “content-language” in the <head> e.g.:
<meta http-equiv=”content-language” content=”en-us”>
(Which is English in the United States.)
2. Include it in the <html> or <title> tags e.g.:
<html lang=”en-us”>
<title lang=”en-us”>
3. Set the “content-language” in the HTTP headers e.g.:
HTTP/1.1·200·OK
Date:·Sat,·23·Jul·2011·07:28:50·GMT
Server:·Apache/2
Content-Location:·qa-http-and-lang.en.php
Vary:·negotiate,accept-language,Accept-Encoding
TCN:·choice
P3P:·policyref=”https://www.w3.org/2001/05/P3P/p3p.xml”
Connection:·close
Transfer-Encoding:·chunked
Content-Type:·text/html; charset=utf-8
Content-Language:·en
If you don’t manually let Bing know about language variations via HTML language tags, it will look at the site’s top-level domain (TLD), e.g. .uk or .de, and determine location from this. You’ll be able to find the complete list of TLDs and their associated information here. Note that .com, .net, and .org are considered international domains and do not determine location.
Bing will also look at where the server is physically located, but this is a light signal and a less conclusive method of determining location. Bing representatives have confirmed that it uses a collection of different methods including looking at HTML language tags, TLDs and server location when trying to best match users to available content.
Thinking about HTML language tags specifically, even though Bing supports these, Google will completely ignore them and suggests that hreflang should be used instead. During a webmaster hangout, John Mueller stated that:
“The language attribute within the HTML markup is something we don’t use at all. We’ve found that this language markup is something that is almost always wrong. So we tend to ignore that.”
Common hreflang mistakes, issues & errors
International SEO is notoriously difficult to get right because of the number of different possible configurations available, and trying to manage and keep track of them across what can be many different language variations.
Here are some of the most common examples where website owners get internationalisation wrong, so be sure to learn from these mistakes and avoid them yourself.
Broken or redirecting hreflang
Broken or disallowed hreflang tags are a real issue for international configurations because they will be ignored by Google, meaning your website versions may not be found or indexed to be shown in search. Hreflang can break if you delete or redirect pages that are part of a set without updating the hreflang URLs on the other pages within that group.
Poor hreflang redirection maintenance can cause serious crawl budget issues. If the multiple hreflang tags are being crawled by search engines and are triggering existing redirect rules, the crawl budget of your site can be impacted as search engine crawlers must request more of these URLs.
Make sure that your hreflang URLs aren’t broken, disallowed or redirecting, which you can do with Lumar. Take a look at Lumar’s hreflang capabilities here.
Inconsistent or incorrect hreflang code usage
As well as ignoring broken hreflang tags, Google is also unable to support incorrect or inconsistent annotations. Regional or continental targeting does not work, so you can’t target the whole of Europe using ‘en-eu’. The country codes are for countries only, so ‘en-gb’ should be used here instead to target the UK as an accepted country code.
Hreflang tags must also be reciprocal in order for Google to be able to accept them. If you have American and Canadian versions of a page, then you must have both the ‘en-us’ and ‘en-ca’ hreflang tags on both pages. This is so that both versions work to ‘verify’ the other and the connection between them. ‘Return Tag’ errors will be shown in Google Search Console when this is an issue on a site
Canonicalising as well as using hreflang
The canonical tags on each of the location or language-specific pages must have self-referential canonical tags. This means the canonical tag of each of the language pages must contain a canonical of that specific language page, and not the originating page. For example, www.example.com/uk would have a canonical of www.example.com/uk.
If the /uk page then has an hreflang tag to www.example.com/austria, then the canonical of the Austrian page should be www.example.com/austria, not www.example.com/uk.
Learn more about international SEO
To learn even more about the ins and outs of hreflang and the other elements of international SEO such as geotargeting and content localisation, make sure you read our comprehensive website internationalisation white paper.
Read the International SEO Guide Now
