What is a hreflang tag?

Contents

What is a Hreflang tag?

If you’re working on an international SEO project, you need the hreflang tag. The Hreflang tag is used to tell search engines which country and language a page is meant for. Specifically, for every page, it tells search engines what the alternate localized variant is for different languages or countries.

The hreflang tag is structured as follows:

<link rel="alternate" hreflang="country-language-code" href="alternative-url">

  • Country-language-code: The ISO code for the language you’re targeting (for instance, English - en), or a combination of the country and language ISO codes (for instance, English - United Kingdom - en-uk).
  • Alternative URL: the URL of the page in the specified country-language code.

Imagine a situation where you’re selling products in the UK, Australia, and Germany. All three countries have their own section on the website:

  • https://www.example.com/en/uk for the United Kingdom
  • https://www.example.com/en/au for Australia
  • https://www.example.com/de/de for Germany

On the homepage of the UK website, you would add the 2 other countries as local variants, as well as the page itself:

<link rel="alternate" hreflang="en-uk" href="https://www.example.com/en/uk">
<link rel="alternate" hreflang="en-au" href="https://www.example.com/en/au">
<link rel="alternate" hreflang="de-de" href="https://www.example.com/de/de">

This helps search engines in 3 ways:

  • You can use the same content for multiple countries. In the above example, a product page for the UK and for Australia may have very similar content in the same language (English), but different pricing and contact details. By setting up hreflang-tags, Google won’t consider both pages as duplicate content.
  • Google will show the right variant to the right audience: searchers from Australia will see your Australian page in their search results, instead of the English one.
  • It helps search engines discover content for other countries. Imagine in this case your Australian and UK page both rank well, but you just got started in Germany and don’t have high rankings there. By pointing the hreflang from the UK to the German page, you indicate that the German page is the best result for searchers from Germany, helping you rank quickly in new countries.

International flags

Guidelines for hreflang tags

Hreflangs are only needed for international SEO

Hreflangs are only needed if you’re targeting different international audiences with different pages. If you’re operating in just one country and language, there’s no need to set up hreflang tags.

Similarly, if you have one website that targets the whole world, without dedicated pages for different countries or languages, there's no need for hreflang tags.

Hreflangs for different domains

The above example has all pages on the same domain, but you can also include different domains in the hreflang tag. What if our example website had different domains for every market? In that case, the hreflnag tags could look like this:

<link rel="alternate" hreflang="en-uk" href="https://www.example.co.uk">
<link rel="alternate" hreflang="en-au" href="https://www.example.com.au">
<link rel="alternate" hreflang="de-de" href="https://www.example.de">

Include the page itself

Next to listing the alternate pages, you also need to include the page itself. This helps search engines identify the language and country of the page itself.

Always use the full URL

The alternate URL must always be a full URL, including https:// and domain name. Do not use relative URLs in hreflangs, even when the page you’re referring to is on the same domain.

Make hreflang tags point both ways

Hreflang tags only work if both pages point to each other. So in our example, all three pages should point to the other pages. If the Australian page points to the German one, but not the other way around, search engines will ignore the instructions.

Hreflangs pointing to each other

Language and country codes

As mentioned, hreflang tags can be used to specify a language and a region. The region comes second and is optional. You can choose to just specify the language, or a language and country combined. Some examples:

en: English, regardless of which country
en-ie: English, for users in Ireland

The language doesn’t have to be an official language for the specified country. You could set up a German page for users in Spain:
de-es

Wikipedia has a full list of ISO country codes and ISO language codes.

Fallback language

Additionally, you might serve various English-speaking countries, but offer only a localized version to some. Say we’re selling in the US, Canada (French and English) and the UK. People from other countries can also buy from the store, but we don’t have a dedicated website for countries like Ireland or Australia. This hreflang setup would cover this situation:

<link rel="alternate" hreflang="en-us" href="https://www.example.com">
<link rel="alternate" hreflang="en-uk" href="https://www.example.co.uk">
<link rel="alternate" hreflang="en-ca" href="https://www.example.ca/en">
<link rel="alternate" hreflang="fr-ca" href="https://www.example.ca/fr">
<link rel="alternate" hreflang="en" href="https://www.example.com"> (targetting the rest of the English-speaking world)

You cannot use a hreflang tag with just a country code: it always needs to be combined with a language code.

X-default and hreflang tags

Apart from the language and country codes, there’s the x-default value. It’s recommended to set a default fallback page for searchers for which you don’t offer a localized page. Use the most applicable language. If you think most of your potential clients understand English, you could use English.

Hreflangs in sitemap

Hreflang tags in the HTML of your page are the most common way to set up localization instructions, but there are other options too. You could specify the localized variants in the sitemap, very similar to what you would do in the HTML:

<?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://www.example.com</loc>
<xhtml:link rel="alternate" hreflang="en-ca" href="https://www.example.ca/en">
<xhtml:link rel="alternate" hreflang="fr-ca" href="https://www.example.ca/fr">
</url>
</urlset>

Every page is specified in the URL element. For every URL, a LOC needs to be specified, and an alternate <xhtml:link rel="alternate"hreflang="language-country-code">for every localized version.

Merkle has created a handy tool to generate an XML sitemap for Hreflangs, by uploading a CSV file.

The same guidelines apply to the HTML version:

  • Always include the full URL, including https:// and domain name
  • Specify an x-default
  • Country is optional

Hreflangs in HTTP headers

If you can’t specify the hreflang tag in the HTML, for instance for PDF documents, you could use a HTTP Header instead. Again the format is very similar. Here’s an example for a US page that has variants for Canada in French and English:

Link: <https://www.example.com>;rel="alternate"; hreflang="en-us", <https://www.example.ca/en/>;rel="alternate"; hreflang="en-ca", <https://www.example.ca/fr/>;rel="alternate"; hreflang="fr-ca",

Aleyda Solis has created a great tool for generating hreflang tags.

SiteGuru hreflang report

Hreflangs can be quite hard to manage: they need to be set up correctly on every page and it’s easy to make a mistake.

SiteGuru's Hreflang report

SiteGuru's Hreflang report makes it easier to see all the hreflang tags on all your pages and identify where something is missing.