A guide to hreflang tag best practices for SEO

If you have a multilingual website or are planning to make your website multilingual, then you’ve almost certainly heard of hreflang tags

In short, hreflang tags are important to:

  • Reach potential customers in different countries.
  • Serve the correct content to visitors based on their region and preferred language.
  • Build a strong international search engine optimization (SEO) strategy for your website.
  • Provide a good user experience on multilingual websites.

By itself, the concept of the hreflang tag isn’t too difficult to understand. However, accurately implementing hreflang tags on your website can be a whole different story – especially if you aren’t familiar with how to do so. Just take it from Google’s John Mueller:

A tweet from Google’s John Mueller saying ‘It's easy to give quick answers to those questions, but IMO the questions show that you need to do more research first. Hreflang (with or without sitemaps) can be really hard, it's worthwhile to “sharpen the axe before splitting all that wood”, to paraphrase Abe Lincoln, OG SEO.

But fret not. In this guide, we’re going to discuss some best practices for hreflang SEO and how to avoid the common pitfalls when implementing hreflang tags on your website.

What are hreflang tags?

A hreflang tag is an HTML attribute used by search engines to understand the language of a particular web page and for which geographical region it was intended.

For example, when we Google ‘Adidas official website’ in the United States, the first result that comes up is “adidas.com”.

Google search result from the United States for Adidas’ official website

When we do the same search from France however, we get Adidas’ official website for France – namely “adidas.fr”.

Google search result from France for Adidas’ official website

These different search results are due to Adidas’ use of the hreflang tag. Hreflang helps tell Google that “adidas.com” is intended for searchers from the United States, while “adidas.fr” is intended for searchers from France.

Hreflang tags may be used in different contexts. For example, a business may want to use hreflang if it wants to offer:

  • Its entire website in two or more languages to cater to audiences that speak different languages.
  • Different content to visitors from different regions that speak variants of the same language. For example, a web page in German for visitors from Germany and another web page in Swiss German for visitors from Switzerland.

Why are hreflang tags important for international SEO?

Hreflang SEO helps signal web page relevance

The hreflang tag sends a signal to Google as to the versions of your web pages that are most relevant for certain search queries. It also signals how high Google should rank these pages in the search results.

This is how it works:

  • Hreflang tags tell Google that a web page has several language and regional variants
  • They provide the link to that web page
  • They specify the language and region of the particular variant that Google is looking at.

Using this information, Google then determines which version of the web page is most relevant for searchers with certain language or regional settings.

For example, your web page might have a hreflang tag indicating that the page is meant for visitors from Japan. When Google sees the hreflang tag, it views the web page as being especially relevant for Japanese visitors and may rank it higher for searches from Japan – which can result in more visibility and clicks to it.

On the flip side, let’s say that your web page doesn’t have a hreflang tag. In this case, Google may decide to serve it up to Japanese searchers anyway. However, if your web page is in English, a Japanese searcher may be less willing to read it and more inclined to quit (or “bounce”) right after landing on it.

The result is that Google will see this user behavior and conclude that your web page is less relevant for Japanese searchers. Because of this, your web page may not rank as highly or receive as much traffic from queries from Japanese searchers in the future.

Hreflang tags help avoid duplicate content penalties

When preparing the language and regional variants of your web pages, you may translate their contents into different languages, thus creating web pages with highly distinct page content. 

Conversely, some language variants – such as pages in English for American and British audiences – may call for only minor content differences in the same language. The result is a website that has web pages with very similar content.

This could cause potential duplicate content issues, because Google’s policy is to try and serve web pages with unique content to searchers. If it comes across web pages with duplicate content, it may decide to rank only one of these web pages.

Or, in cases where Google suspects that the website owner is trying to manipulate their search rankings, Google may even decide to rank none of the web pages. Needless to say, all this spells trouble for your attempts to direct searchers to your website.

However, the good news is that you can use hreflang tags to avoid such duplicate content penalties. With hreflang tags, you are telling Google that your web pages are meant for – and should be served to – different audiences, and so these pages shouldn’t be treated as identical content.

Hreflang tags are not a directive

However, be aware that hreflang tags are not a directive.

In other words, while a correct hreflang implementation can help influence Google’s decision on which version of your web page is most relevant to searchers, Google is not obliged to show them the version that you want to show to searchers.

That’s because Google may also take other SEO factors into consideration when deciding on the relevance of a web page (and hence how high to rank it) for any given search query. Examples of these factors are your website’s load time, mobile friendliness and domain authority.

The user’s search settings in Google also play a role. For instance, users browsing from France with their language preference set to English, will mostly be shown search results in English rather than in French.

Of course, this doesn’t mean that you should skip hreflang and SEO best practices altogether. As mentioned, hreflang tags are important because they send a signal as to which web pages are most relevant for certain search queries.

Then, when your web page matches a searcher’s intent (meaning that it fulfills the user’s primary goal when searching a query in a search engine), Google will know that your web page is especially relevant for that particular search. It may then rank it higher for similar searches in the future – which is what you want.

Importance of hreflang tags for international brands

Ensuring that the content that you produce reaches the right target audience

When marketing to an international audience, you’ll need to create website content that’s suited to your visitors’ local context.

For example, take a look at the global homepage of beverage multinational corporation The Coca-Cola Company:

Global homepage for The Coca-Cola Company

Then, compare it with the homepage for the brand’s Australian website:

Australian homepage for The Coca-Cola Company

You’ll notice that The Coca-Cola Company has changed the corporate social responsibility program messaging on its Australian homepage to highlight its efforts to help Australian communities. This might resonate more with Australians compared to featuring a global initiative, and generate more goodwill among the brand’s customers in Australia.

Similarly, you may want to craft different content to suit visitors from different regions. But if such content fails to reach its target audience, then you might not get the return on investment that you’re looking for.

This is where hreflang SEO comes in. With hreflang tags, you can help search engines direct searchers to the right versions of your web pages. This way, searchers will view the content that they were meant to view, as opposed to another version.

Fostering a more pleasant user experience

Imagine that you’re shopping for jeans online. You’ve found the perfect pair, and want to know how much it costs.

However, the price of the jeans is displayed in a foreign currency. You’re frustrated, as you’d have to convert the price to your local currency to know how much it’d cost you. You might not even bother with the hassle and decide to abandon the purchase altogether.

To remove such friction in the customer journey and provide a more pleasant user experience, you’ll need to be able to show content that’s customized to your visitor’s context – and hreflang tags can help with that.

As an example, visitors to clothing brand Levi’s United Kingdom website will view this site layout and product listing:

Levi’s United Kingdom website product listings

While those visiting Levi’s China website will see a different selection of products and content that is more adapted to their market:

Levi’s China website product listings

The result? A smoother user experience on the Levi’s website, which is bound to increase website engagement and sales.

Facilitating a successful international content strategy

Hreflang tags direct visitors to the appropriate versions of your web pages automatically. This means that you don’t have to leave visitors to pick their country to be shown the right content.

Instead, when Google detects the searcher’s location, it will match this to the correct language version of your website and push the latter to the searcher accordingly.

As an example, if you Google for the website of athletics giant Nike with your location set to the Netherlands, Google will serve up Nike’s Dutch website, as opposed to the brand’s other country-specific websites.

Search results for ‘nike’ when using Google with your location set to Netherlands

Such automatic redirection of traffic can be the difference between visitors having a seamless user journey on your website, or bouncing in favor of a competing one.

Considering the extent of resources you’ll need to create customized content for each of your destination markets, you’ll definitely want to improve the chances of success for your international content strategy as much as possible.

Hreflang tag FAQs

What do the hreflang attributes look like?

Although hreflang tags can look complicated, they have a straightforward structure. They consist of three HTML attributes:

  1. rel: this tells Google that the link in the hreflang tag points to an alternate version of the content instead of the original.
  2. hreflang: this specifies the language and the region that this content version is meant for, in “language-region” format.
  3. href: this contains the link to the web page that Google should direct visitors with such language and region settings to.

For example, hreflang tags for web pages meant for French and English speakers in Canada would look like these respectively:

  1. <link rel=“alternate” hreflang=“fr-ca” href=“http://www.example.com/ca/” />
  2. <link rel=“alternate” hreflang=“en-ca” href=“http://www.example.com/ca/” />

A website may also have one web page in Spanish intended for visitors from Spain, and another web page in Spanish intended for visitors from Mexico. In this case, hreflang tags can be extended with hreflang annotations. Annotations will have to be added to both web pages to tell Google which localized page it should be serving to Spanish and Mexican visitors respectively. The hreflang tags would look like these:

  1. <link rel=“alternate” hreflang=“es-eshref=“http://www.example.com/” />
  2. <link rel=“alternate” hreflang=“es-mxhref=“http://www.example.com/” />

If you don’t have alternate content versions for certain languages, you can set the hreflang attribute to the fallback value of x-default. Like so:

<link rel=“alternate” hreflang=“x-default” href=“http://www.example.com/ca/” />

This is a good practice, especially for web pages that aren’t catered to any specific language or region but allow visitors to select their country.

Where do the hreflang attributes go?

There are a few places on your website where you can put your hreflang attributes:

  1. For HTML content such as web pages, you can put your hreflang attributes in the <head> section of every page. (This is where the Weglot plugin will add hreflang attributes if you’re using it to automatically translate your web pages.)
  2. For non-HTML content such as PDF files, your hreflang attributes can go in these files’ HTTP headers.
  3. In your website’s XML sitemap if you’d like to put the hreflang attributes for all the web pages of your website in one place. Putting hreflang tags in your XML sitemap also helps avoid a possible slowdown in page load speed from using the <head> section method. That said, any slowdown will generally be negligible to begin with.

If you will be manually implementing hreflang tags on your website, take note that you need to use only one of the above methods.

How many hreflang attributes does a page need?

There are no minimum or maximum limits on the number of hreflang attributes you can add to any given web page. You could have 10, just one or even none at all.

However, this doesn’t mean that you should try to add hreflang attributes for all variations in language and region. Creating content for each possible variation will take up significant resources, so focus on producing content for only those that make sense for your business. Then, add the relevant number of hreflang attributes to your web pages accordingly.

And for all other variations that you don’t have specific content for, cater for them by using “x-default.”

How should you index your pages after adding hreflang tags to them?

You’ll want Google to find all of your web pages so it can serve them to the right visitors. Therefore, when doing hreflang SEO, you should be indexing all of your web pages – the original content and all its variations.

Be sure that none of your pages (whether the original or the variations) contain noindex tags, as these can conflict with the hreflang tags’ instructions to index both the original and the content variations.

In addition, if Google doesn’t index these pages, then it won’t see your hreflang instructions on them. As a result, it won’t be able to serve the pages to the searchers who should be seeing them.

How do you implement return links?

Hreflang tags come in twos. In other words, if you have a hreflang tag on the original web page that links to an alternate language version of the page, then that alternate page must also have a hreflang tag that links back to the original web page.

Such hreflang links are called return links, or bi-directional links. To implement them, you’ll need to add them to all of your original web pages and their alternates, and make sure that the originals point to the alternates and vice versa. Otherwise, Google may not be able to serve the right versions of your web pages to the right visitors.

Common mistakes to avoid when using hreflang tags

Using the wrong method to implement hreflang tags

We’ve covered three methods of hreflang implementation above, and you can choose one (and only one) of them to use for your website.

Be sure to implement your chosen method properly as well, or this can result in problems in your hreflang tag setup. (If you’re using Weglot, you don’t have to worry about inaccurate implementation as it will set up everything correctly on your behalf.)

Not using the correct language and region codes for your hreflang link attributes

You need to use the right ISO 639-1 language codes and ISO 3166-1 region codes when stating the language and region of your hreflang link attributes. For example, you should be using “ko” to refer to the Korean language but “kr” for the region of South Korea.

Using the wrong language or country code may throw up a “your site has no hreflang language tags” error in Google Search Console. Visitors may also see the wrong version of a page.

Using the hreflang tag on only your homepage

Hreflang tags need to be implemented on all pages of your website that have language and regional variants, and not just the homepage. Otherwise, you’ll signal that you have one or more variants for the homepage only but not for your other web pages.

Using hreflang tags to point your web pages to irrelevant language variants

Adding hreflang tags for language variants to web pages that haven’t been customized for such languages might sound like a good strategy for covering all your bases. However, this exercise is more likely to be a waste of time.

That’s because when visitors view these web pages that have not been tailored to their context, they will probably get confused and bounce. Google may pick up on this and note that your web pages have lower relevance for such visitors – and hence rank them lower for similar searches in the future.

Using the same language variants for visitors from different regions

France and Belgium may both have people who speak French, but this doesn’t mean that you can serve the same version of your web page to French speakers from both France and Belgium.

This is because your web pages will need to be tailored to the local contexts for both groups, be it in terms of content or culture, if you want to provide a truly localized user experience.

Adding hreflang tags to noindexed pages

These web pages have been noindexed, which means Google is unlikely to index them – or see and process the hreflang tags that you’ve spent time adding to them.

Not providing a fallback page for uncatered variants

As mentioned above, you don’t have to provide alternate versions of your web pages for all possible languages and regions. However, you should have fallback pages that Google can serve to visitors with language and region settings that you haven’t catered for.

Don’t forget to set up the “x-default” hreflang attribute for these pages either!

Not keeping your hreflang tags up to date

As your website grows, be sure to stay on top of your website structure and monitor whether your hreflang tags need updating.

For example, if you add a new domain for a country, you’ll need to add hreflang tags to all your existing web pages to point to the web pages in that new domain. Or, if you have deleted a language version of your website, then the hreflang tags that point to that language version will also need to be removed.

You don’t want to have hreflang tags that point to missing or incorrect URLs – this hurts the user experience and can also affect your rankings in Google searches.

Hreflang tag vs canonical tag: what’s the difference?

Hreflang tags indicate to Google which one of the different (but often similar) versions of your web page should be served for different language and regional searches. For example, if you’re in Spain, then you should be served a Spanish web page meant for visitors from Spain, instead of a Spanish web page meant for visitors from South America.

On the other hand, you may have several web pages with similar (or even identical) content, and you want Google to index and give ranking priority to only one of these in the search engine results. Here, you’d use a canonical tag to indicate to Google which web page this is, so that it doesn’t rank some other page instead. Doing so can also help you avoid duplicate content issues.

Hreflang and canonical tags can be implemented together, but it’s important to do this correctly. Otherwise, you may be sending conflicting signals to Google on which pages it should be indexing, such that it decides to ignore all your directives completely.

To implement hreflang and canonical tags together, you should add your hreflang tags and their return links to your web pages as per usual. Then, add canonical tags that indicate the canonical versions of these pages in the same language (or the best possible alternate language if there isn’t one).

This will result in your web pages having:

  • One canonical tag that points to the canonical version of the page (whether it is itself or another page).
  • As many hreflang attributes as needed for all the language variants that you’ve catered for.

What is the best way of adding hreflang tags to your multilingual site?

It’s possible to manually add hreflang tags to your multilingual website (see above for the three methods we’ve covered). However, the most recommended solution is to use a plugin that will do all the heavy lifting for you.

If you’re using a quality translation solution like Weglot to prepare your web pages for multilingual SEO, then you can rest easy as your hreflang tags are implemented to your website automatically. Your setup will also be error-free, helping you avoid many of the common hreflang mistakes we’ve mentioned in this guide.

How to check that a hreflang tag has been correctly implemented

Hreflang Checker tool by Weglot

For peace of mind, it’s a good idea to double-check that your hreflang tags are working after you’ve implemented them. We’ve developed a handy Hreflang Checker tool for this very purpose!

Simply paste the URL that you want to check into the search bar of the tool (with “http://” or “https://” in front), choose the search engine bot that you want to mimic and then click on the “Test URL” button.

Here are some demo results, using ecommerce platform Shopify’s website as an example:

Results from using the Hreflang Checker tool to check for hreflang tags on the Shopify website

Our Hreflang Checker tool will work regardless of whether you’ve implemented your hreflang tags manually or through using the Weglot plugin, so go ahead and give it a spin.

Get the hang of hreflang

Hreflang SEO is a powerful tool for ensuring that the different language versions of your content reach their intended audience, especially if you’re targeting an international crowd.

If you haven’t already implemented hreflang tags on your website, then we hope this guide has helped show you the benefits of doing so and how you can get started. On the other hand, if you’ve realized that you’ve made a mistake in your hreflang SEO implementation, use the pointers in the guide to take care of this important aspect of your multilingual website.

Either way, keep in mind that after you’ve added hreflang tags to your website, or corrected your existing implementation, you’ll need to wait at least a couple of days for any ranking changes to occur. This is because Google will have to reindex your website to pick up on your changes, and such reindexing might not happen immediately.

Also, don’t be disappointed if you don’t see an increase in traffic after implementing hreflang tags on your website. The goal of adding hreflang tags is to serve the right language version of your content to the right users, and this might not necessarily translate to more website visitors. Instead, looking out for improvements to your website engagement and bounce rates may be the better way of seeing if your hreflang tags are making a difference.

Of course, hreflang SEO is only one of the things that you’ll need to do to make your website multilingual. There’s also the translation of your website content to think about – and Weglot can handle this effortlessly and with a high degree of accuracy.

If needed, Weglot can also automatically add hreflang tags to your website, so that’s one thing off your plate as you plan your foray into the international markets. But you don’t have to take our word for it – sign up for a free trial to experience the power of Weglot for yourself.

Start your free trial
See how Weglot works on your website with our 10-day free trial.