As a business grows and demand increases, the need and want of that business is to widen their market reach. Often businesses grow their market internationally and as a consequence, they require an international SEO strategy (you can read about international SEO here).
The hreflang tag serves as part of an international SEO strategy and was introduced by Google in 2011 to help websites increase their visibility to users in multiple countries with different language variations.
The tag also allows you to show search engines the relationship between your web pages in alternate languages. It’s particularly useful when you have created content that is specific to a local audience. Essentially, the tag signals to search engines that a user may be querying in language “x” will want this result instead of a page with similar content in language “y”.
You can also take it one step further by implementing the tag to show that you have content targeted towards variants of a single language. If this is the case, you can target pages more specifically by extending the tag to to indicate a particular region the content is localised for e.g. Spain (hreflang=”es-es”) versus Spanish – Mexico (hreflang=”es-mx”). This extension comes in handy when you want to control variations for shipping, currency, culture, etc.
If your page serves content in multiple languages or asks a user to select their preferred page, you can implement the x-default to show that the page is not specifically targeted. The code looks like:
<link rel=”alternate” href=”http://example.com/ ” hreflang=”x-default” />
It’s important to bear in mind that hreflang is not a directive, it’s a signal. This means that other SEO factors can actually overide the tag and therefore cause different variations of your site to rank higher. Before diving straight in, I’d recommend reading up on other international SEO best practices and taking a look at Google’s documentation on using hreflang.
“Return Tag Errors” are the result of hreflang annotations that don’t cross-reference each other. Often, marketers may put the proper tags on certain pages e.g.
< link rel=”alternate” href=”http://example.com/en/test.htm” hreflang=”en” />
< link rel=”alternate” href=”http://example.com/fr/test.htm” hreflang=”fr” />
But then forget to include them on other pages, creating a problem known as “Return Tag Errors”. Google is simply saying: “If page A links to page B, page B must link back to page A otherwise the annotations may not be interpreted correctly”. When there are return tag errors, Google Search Console will often flag up the issue and provide some recommendations.
When you are adding hreflang codes to your webpages, you need to make absolutely sure that you are using the correct country and language codes. In order to function properly, a hreflang attribute must be one of the following formats:
One of the most common mistakes we see in SEO is using ‘en-en’ or ‘en-uk’ to specific English speaker in the United Kingdom. However, the correct hreflang tag that should be implemented for the UK is actually “en-gb” because ‘en-uk’ for example does not exist within Google’s language codes.
An example of using ‘en-en’ is Ferrari.com – take a look below at their code.
But what actually happens when you search ‘Ferrari’ in Google?
Technically the URL we’d like appears (minus the underscore instead of the hyphen) but this isn’t reflected within the tag.
You can use a hreflang generator tool like this one to see which values you should be using but I’d suggest reading up on Google’s language/country code before diving in deep.
As stated earlier in the post, the hreflang tag will not alleviate duplicate content problems.
If you have two pages that are in the same language but that are targeting different regions, such as English in Canada and English in the US, the content may be similar and therefore potentially deemed as duplicate.
Hreflang won’t solve the issue; it is still possible that your American page may outrank your Canadian page if the American page has significantly more link authority, and especially if it has links from Canadian sources.
Adding hreflangs will not solve this issue but they can help alleviate the issue – hence why hreflang tags alone are simply not enough. The tags only offer a technical structure that helps Google to sort through and understand your content, but to have a well-rounded international site, you need a holistic international marketing strategy that includes building links and authority to your site from the relevant languages/countries you are targeting.
The hreflang tag can be used alongside your rel=”canonical” tags. For example, page A should have a canonical tag pointing to page A, page B should have a canonical tag pointing to page B, and page C should have a canonical tag pointing to page C. All three pages should have hreflang tags that mention all three of the pages in the group. Let’s look at some examples:
On this page, http://www.example.com/usa/ the hreflang tags may be:
So in this case, the canonical tag would be:
<link rel=”canonical” href=”http://www.example.com/usa/” />
On the Canadian page, the hreflang tags may stay the same, but the canonical tag for this page would be:
<link rel=”canonical” href=”http://www.example.com/ca/” />
This one may seem obvious but websites do make this mistake. It’s best practice to make sure that URLs in rel=canonical and in hreflang tags should be absolute URLs beginning with http:// or https:// as appropriate. There really isn’t any margin for error, so always make sure you are using absolute URLs and NOT something like the following:
<link rel=”alternate” hreflang=”en-ca” href=”/ca/” />
Google needs to be able to crawl the entire URL path, especially since hreflang tags are often referenced by separate ccTLDs or sub-domains.
So there we have it, a run through of common hreflang issues. Have you struggled in the past with hreflang issues? Am I missing any crucial problems? Let me know in the comments.
Image credit: Nicolas Raymond – Abstract Acrylic