Hreflang: Your Complete Guide to Hreflang & SEO

How to Use Hreflang for SEO

If your website targets users all around the world (meaning that you are involved in the International aspect of SEO), you may want to translate it into different languages to cater for different countries or regions. While this is certainly good for your users, it may not be so for search engines.

Simply publishing translated versions of your content on different URLs won't help Google understand the relationship between URLs and how your site is set up. This is suboptimal and can lead to your pages not ranking as well as they could.

Luckily, there's a relatively simple solution for this: hreflang.

What is Hreflang and What Does It Do?

The hreflang tag is an HTML meta tag that specifies the language and (optionally) the relevant geographic region for a page. Hreflang tells search engines where to find the content in other languages.

When done correctly, each hreflang tag tells bots reading the page where to find the appropriate content for users that don 't speak the first page 's language. When someone performs a search Google (Bing doesn 't use the hreflang tag) takes the following steps:

It decides where to rank a URL based on its algorithm
It checks a page 's code, looking for hreflang tags
It looks at a user 's current location (based on IP address) and language settings
It displays the most relevant URL in the SERP and sends the user (if the click) to that URL

The reason the search engine checks for hreflang tags is so that it can serve the right version of a page based on the user 's language settings. In short, it 's how Google knows which URL to display for a Spanish speaker and which one to use for an English speaker. It 's also how it knows which version to show someone in the United States and someone in the United Kingdom.

When Should I use Hreflang?

There are 3 situations in which you should use hreflang.

When you translate only the page template into alternate languages, but not the main content of the page. An example of this would be a page that features user-generated content like forums and message boards.
When you have pages in the same language using regional variations. For example, you have separate English versions of a page for the US, Canada, the UK and Ireland.
When you've fully translated your website content into multiple languages. For example, WooRank is available in 6 languages: English, Spanish, French, Portuguese, Dutch and German. When our content is available in 2 or more of those languages, we'll add hreflang tags to the pages denoting that.

To see how WooRank uses hreflang, simply check out our homepage. Right click on the page and click "View Source." Then, you can do a simple find for "hreflang" and see it in action:

How to Add Hreflang Tags

Adding hreflang tags to a page

If you have an HTML page, the hreflang tag goes in the <head> like this:

For non-HTML pages, like PDFs, add the hreflang annotation in the HTTP header:

Link: <https://www.example.com/>; rel="alternate" hreflang="en"

In the examples above, the hreflang="en" part of those tags tell Google the listed URL is the English version of the page. So it would show that URL to users who have their English set as their language in their browser and those in English-speaking countries. If they had hreflang="es", Google would display that URL for Spanish speakers.

When adding hreflang tags to your pages, you have to include a link to every version of the page, including a self-reference. So, if you have a page in English, Spanish and French, each page would have all three tags:

Adding geographies to your hreflang tags can be done by adding a country code after the language code in the hreflang attribute. So if the website above is targeting different countries with each language, they would look like this:

When Google sees these tags, it will know to show the English version to users in the US, Spanish to users in Mexico and French to French-speakers in France.

When adding hreflang tags to your pages, always use the ISO 639-1 format for languages and the ISO 3166-1 Alpha 2 format for countries. The hreflang value must always be written language-country, and geotargeting is limited to countries. Google does not support cities, regions or continents.

Test your hreflang implementation using WooRank's hreflang tag checker.

You can check your hreflang tags have been set up correctly by running a Free WooRank Review.

Adding hreflang to an XML sitemap

You can also add the hreflang tag to your XML sitemap. Adding your hreflang annotations here can be painful since you need to add every language option to every URL in your sitemap. Here 's just one URL 's worth of markup for a page in two languages:

<url>
<loc>https://www.example.com</loc>
<xhtml:link rel="alternate" hreflang="en" href="https://www.example.com" />
<xhtml:link rel="alternate" hreflang="es" href="https://www.example.com/es" />
</url>
<url>
<loc>https://www.example.com/es</loc>
<xhtml:link rel="alternate" hreflang="es" href="https://www.example.com/es" />
<xhtml:link rel="alternate" hreflang="en" href="https://www.example.com" />
</url>

Not a huge deal when you 've got one page with only one alternate, but it can quickly become arduous as a site grows, adding more pages and languages. There are, however, some good reasons to add hreflang annotations to your XML sitemap:

Sitemaps help search engines find and crawl sites. So adding alternate URLs to your sitemap will help them get found more efficiently.
It keeps extra code off the page, reducing the page size. It may not seem like much, but when even a second of load time costs sales, every little bit counts.
Keeping all your hreflang links in one place makes change management much easier. Updating a bunch of different pages is more difficult than changing one sitemap.

What's a sitemap?

An XML Sitemap is a text file used to list all the URLs on a website. It can include extra information (metadata) on each URL, with details of when they were last updated, how important they are and whether there are any other versions of the URL created in other languages. All of this is done to help the search engines crawl your website more efficiently, allowing any changes to be fed to them directly, including when a new page is added or an old one removed.

Using hreflang and canonical tags together

Hreflang tags are not a substitute for the canonical tag. In fact, they can and should be used together. Simply add the canonical tag to each version of the page, pointing back to itself. So, for the site in three languages, the English markup should look like this:

And, then you 'd do the same for the Spanish version:

And then again for the French page:

Pretty simple, but it can be easy to get wrong. There are two main mistakes people make here:

Incorrect country code usage, usually using "uk" for the United Kingdom. The correct code in the ISO 639-1 format is "gb". It is also not unusual for people to accidentally switch the language and country values.
Using non-canonical URLs in the hreflang tag. Hreflang and canonical tag work together to explain how your site works to search engines. Using non-canonical URLs in either tag will confuse Google and break your implementation.

How Does It Impact SEO?

Hreflang has two main uses when it comes to SEO. The first thing hreflang will do for your SEO is help reduce the impact of duplicate content. Hreflang tells Google that there 's a relationship between the two pages and helps their bots interpret the relationship between the two, instead of seeing two copies of the same content.

What's the best international site structure for your website's SEO?

The second is that it helps you to make sure the right content is being served to the right users. If you 've got a site in multiple languages, or that targets multiple geographies, you 've likely put a lot of time, thought and effort into tailoring your content and marketing strategy to these audiences. Without an hreflang tag, Google could wind up displaying an English page for a user who only speaks Spanish, or serve American content to an Australian user.

This isn 't the end of the world, but it will cause your site 's bounce rate to go up and will very likely negatively impact your conversion rates. Most people aren 't going to take the time to find the right language version of a page, no matter how prominently you display it.

Generic international landing pages

There is one more way to use hreflang to help shape your SEO: x-default. This is a special hreflang value that tells search engines which page to serve if a user doesn 't match any of the languages specified in the other hreflang links. Basically, x-default sets an international landing page. So, going back to our original example of a page in English, Spanish and French:

None of the URLs specified are really relevant to a user that doesn 't use English, Spanish or French. Adding the x-default attribute, like this: <link rel="alternate" href="https://www.example.com" hreflang="x-default" />, would tell Google to display www.example.com for all other users. In the case of the example above, that page would be displayed for non-English, Spanish or French speakers all over the world.

X-default is really useful for sites that use international splash pages that ask users to indicate location/language, pages that detect users ' location via the Accept-Language header, or who only want to target a few specific languages and/or countries.

Common Hreflang Errors

Hreflang is, ultimately, pretty straightforward. However, since you need to add an hreflang tag to every translated page including links to each version, you can have lots of opportunities to make mistakes with your hreflang.

Having hreflang errors on your pages or in your sitemap can cause Google to get confused when crawling your site, resulting in content being shown to the wrong audience.

Here are the most common hreflang mistakes and how to avoid them.

Using the wrong language or country code

One of the most common mistakes people make with hreflang tags is to use the wrong values for language or countries. As mentioned above, Google supports the ISO 639-1 format for languages and the ISO 3166-1 Alpha 2 format for countries.

Possibly the most common mistake is when people want to target user is the United Kingdom. Annoyingly, the ISO code for the UK is gb. Many people mistakenly use uk instead.

Mistakes with the language abbreviations can also cause issues. A common one is using eng instead of en for English content, ch instead of zh for Chinese, or something other than es for Spanish content.

Typos in ISO codes can also result in Google serving the wrong content based on language. Accidentally typing fi instead of fr can result in French content being shown to Finnish speakers.

Incorrect or missing references

Hreflang is all about referencing the correct URLs. As we covered earlier, each version of your content has to reference all the other versions. Including itself.

Incorrect or missing references (also called return tags) is one of the more common mistakes people make when implementing hreflang.

Forgetting the self referencing hreflang tag is probably the most common return tag error. However, it's also not uncommon for website owners to leave return tags off of one page and not another.

People will also sometimes include inconsistent references. So one page references

But the code for https://www.example.com/es includes this markup:

These incorrect references prevent Google from understanding how the content relates and from indexing the pages correctly.

Not using hyphens

Language and country codes must be separated by a hyphen for them to be correctly read. People sometimes use underscores, commas, semicolons or other punctuation between them.

This is something you will need to check yourself, as you can't rely on Google Search Console to alert you to these errors.

Linking to redirected, broken or nonexistent pages

Linking to pages that return 4xx, 5xx or HTTP status codes other than 2xx is almost always a problem. And hreflang links are no different.

If Google can't access the page linked in the hreflang tag, it won't be able to crawl, index and serve that content to the right audience.

And while relative links technically don't count as broken, they're still errors in hreflang tags. All hreflang links must be absolute (meaning, they include the domain of your website in the URL).

Swapping language and country codes

In order to be valid, the hreflang codes must be "language-country". Putting the country before the language, as in us-en instead of en-us will cause your hreflang tag to be invalid and likely ignored by Google.

How to Track Hreflang Errors

The best way to fix hreflang errors is to check the International Targeting Report in Google Search Console.

Google Search Console international targeting report to track hreflang errors

This report hasn't been moved to the new Search Console yet, but you can still access it in the old version.

Hreflang: Your Complete Guide to Hreflang & SEO

How to Use Hreflang for SEO