Google's John Mueller once tweeted: "TBH hreflang is one of the most complex aspects of SEO (if not the most complex one). Feels as easy as a meta-tag, but it gets really hard quickly."
We've helped dozens of clients work through this complicated process. In this article, we'll be covering everything you need to know about properly implementing hreflang tags on your site.
What is an Hreflang Attribute?
An HTML rel="alternate" hreflang="x" markup that denotes the language or region your webpage is targeting. The attribute makes sure Google knows which page to rank, in which language, and in which location (i.e. in Google US, UK, etc).
The hreflang tag is important because it can help your website get more exposure for international search queries.
It's important to note, hreflang will NOT:
- Improve performance if your website is only in 1 language.
- Transpose rankings across SERPs. Ranking for "Nike shoes" in Google US will not translate into equal rankings in Google Mexico.
- Fix errors with duplicate content. The hreflang tag does not function like a canonical tag.
When to Use Hreflang Attributes
Hreflang attributes should be used for content that's specific to a local audience. The tags help Google understand the relationship between your pages in alternate languages and regions.
Use hreflang when:
- Your pages are in the same language, but different markets (e.g., pages in English targeting US, UK, Australia, Canada)
- You have the same pages translated into different languages (e.g., Spanish, French, and German)
- You translate sections of your website into a different language (e.g., a forum with UGC in multiple languages)
How to Use Hreflang Tags
The hreflang tag gets added to the <head> of each relevant page. A simple example:
<link rel="alternate" href="http://example.com/en-gb/" hreflang="en-gb" />
The attribute tells Google that http://example.com has an "alternate" page. That page can be found at http://example.com/en-gb/ and it's written in British English.
There are 2 elements of the tag:
- Language codes — ISO 639-1 format
- Location/Country codes — ISO 3166-1 format
Misused language and country codes are a common error that can hurt your rankings. Triple check your codes before implementation.
Hreflang Use Cases
Multi-Language Websites
The simplest use case is when you translate your website into multiple languages. Best practice is to set up subfolders for each language:
example.com/es/
example.com/de/
Neil Patel translates his blog posts into 5 different languages to maximize traffic:
<link rel="alternate" href="https://neilpatel.com/br/" hreflang="pt-br" />
<link rel="alternate" href="https://neilpatel.com/de/" hreflang="de" />
<link rel="alternate" href="https://neilpatel.com/es/" hreflang="es" />
<link rel="alternate" href="https://neilpatel.com/it/" hreflang="it" />
Regional Targeting
When you want to distinguish between two locations that speak the same language. CNN uses a subdomain to target UK readers but the same domain for US and Canadian audiences:
<link rel="alternate" href="https://www.cnn.com" hreflang="en-us" />
<link rel="alternate" href="https://www.cnn.com" hreflang="en-ca" />
Cross-Domain Tags
If you have multiple top-level domains, you'll still want to link them with hreflang tags. ASOS uses a combination of TLDs, subdomains, and subfolders to manage their international presence. Generally speaking, best practice is subfolder structure across a single domain — this preserves SEO equity and reduces effort required to manage multiple domains.
How to Implement Hreflang
Google recommends 3 methods:
HTML Link Element in the Header
This is generally the most followed route. You'll need to write the hreflang attributes and then have a developer insert them into the <head> on all the pages needed.
<link rel="alternate" href="https://example.com/es/" hreflang="es-co" />
HTTP Header
If you publish non-HTML files (like PDFs), you can use an HTTP header to indicate a different language version of a URL.
Sitemap
You can submit hreflang via sitemap. Using an English and Spanish site as an example:
<loc>https://example.com</loc>
<xhtml:link rel="alternate" hreflang="en-us" href="https://example.com" />
<xhtml:link rel="alternate" hreflang="es-co" href="https://example.com/es/" />
</url>
Troubleshooting Hreflang Implementation
Tools like SEMrush can flag issues you might be having. For deeper technical audits, you'll want a more hands-on approach. You can start by mimicking Google search results from other locations by altering the URL string:
- Mimic a Spanish searcher in the US:
http://www.google.com/search?hl=es&gl=us&pws=0&q=seo - Mimic a searcher in Australia:
http://www.google.com.au/search?hl=en&gl=au&pws=0&q=seo
Common Errors to Avoid
There are a handful of small items that can create a big headache:
- Errors with codes — Tag used in the wrong order or incorrect selections. Triple check your tags before implementation.
- Errors with sitemaps — If implemented via sitemap, make sure to follow Google's guidance. It's easy to miss ASCII codes which can break sitemaps.
- No alternative page — Don't use hreflang without a link to an alternative page. This can cause GSC to return errors.
- NOINDEX pages — Don't use hreflang on pages set to NOINDEX. This can result in a number of errors.