What is Hreflang?
Explain to me like I’m five.
You will use Hreflang if—and only if—you have multiple pages (URLs) that all have the same content translated into different languages.
These pages do not all have to be on the same domain. For example, your English content could be at https://www.example.co.uk and your Spanish content could be at https://www.example.es. Or these pages can be on different subdomains, like en.example.com and fr.example.com. You could even create separate folders for each language, e.g. www.example.com/en/foo.html and www.example.com/de/foo.html.
What does Hreflang signal?
The Hreflang signals to search engines that content on this page is exactly the same as content on another page (or pages) that are in a different language. This means that both pages can share link authority.
Let’s say your primary site is in English and has been live at http://www.example.com for many years. Let’s say you sell system administration services and you’ve been operating in the U.S. for a while. Over time, your site has accumulated some good backlinks. Now you want to launch in the German market so you translate your site in German. Most pages on http://www.example.com now have a corresponding German language page at http://de.example.com.
Let’s say one such page—your top organic traffic landing page—is http://www.example.com/how-to-choose-a-sysadmin. Your corresponding German page is http://de.example.com/Wie-man-ein-sysadmin-wahlen. Naturally, you’d like the new page to benefit from the link equity generated by the longstanding English page.
That is what Hreflang can do for you.
Update: Google has confirmed that using Hreflang for a new language version does not transfer equity from sister sites. The only thing it does is if your EN version was already ranking in the DE market, then the new site and associated Hreflang markup will allow Google to swap out the EN URL and replace it with the DE URL in German-speaking markets.
Show me the tag
Here’s what the Hreflang tag will look like:
<!doctype html> <html> <head> <meta charset=utf-8> ... <link rel=alternate hreflang=de href="http://de.example.com/Wie-man-ein-sysadmin-wahlen" /> <link rel=alternate hreflang=en href="http://www.example.com/how-to-choose-a-sysadmin" /> <link rel=alternate hreflang=x-default href="http://www.example.com/how-to-choose-a-sysadmin" /> ... </head> <body> ...
In future blog posts I’ll dive deeper into the nuances of hreflang implementation and the mistakes people typically make when implementing Hreflang. For now, note the following:
- Tags appear in the <head> of the HTML like other meta tags. But these are <link> tags while other tags like the description or robots/noindex are <meta> tags.
- There are 3 <link> tags: one for English, one for German, and one for signaling the default language. This signals to search engines which page to show when the user’s language is—respectively—English, German or unknown/other.
- The same set of 3 <link> tags appear on both the English and German pages. This means the pages link to each other and to themselves. This is very important.
When to use Hreflang
Hreflang is to be used only when the content is exactly the same on both pages. Here are some examples:
- Homepage for sites in different languages
- A blog post about a new product or feature
- Product pages for e-commerce sites. Prices and currencies may be different on both pages, but that’s OK. The main content—product description, pictures, videos, ratings—should be substantially the same on both pages. I say “substantially” because you may have some regional variations, e.g. the German page may specify product dimensions in metric units like cm instead of inches. Customer reviews should ideally be translated but are considered supplemental content so it’s OK if pages in different languages have different customer reviews. It is also OK to show English reviews (without translation) on the German page.
- Landing pages for tools or widgets like store locator or mortgage calculator.
- Company information pages like the About page, management, investor relations info, pages describing services offered
- Check-in procedure for airlines
- Amenities offered at a resort or theme park
- A community forum where users have posted mostly in English but the site offers language-based variations where the header, footer, navigation are translated. This makes it easier for people all over the world to use the site even if the posts are all in English.
Here are some examples where Hreflang should not be used:
- English page that lists store locations in the U.S. and German page that lists store locations in Germany.
- When you have duplicate content in the same language, use rel=canonical instead.
Resources for further reading
- Internationalization FAQ for Webmasters – by Google
- Use hreflang for language and regional URLs – by Google