world cup

HREFLANG Tags – What are they and how do I use them?

Hreflang tags are similar to canonical tags; they are the technical way of indicating to a search engine crawler where an alternative language version of a particular piece of content is located. For a page aiming to serve international visitors this is one of the most vital things to get right if you want to ensure the best user experience. What this means is that if you have a page, e.g. https://www.example.com/en (English version), but you also had https://www.example.com/es (Spanish) for a Spanish user, you would want them to see the Spanish version of the site in search results. This markup ensures that Google can identify this alternate version and in turn serve it to the user appropriately.

In this article we will show you a quick and easy way to take care of HREFLang tags within WordPress. We will also talk about things to avoid and how you can test your work once it’s done.

Why Do I need to Implement hreflang tags?

1 – It helps serve the correct content to your user preventing them from bouncing, which will in turn indicate that your page is relevant for the user and improve rankings.

2 – It helps deal with duplication issues; if you are serving the same content but in different languages, the tag tells Google that the content is not duplication but optimised for a certain audience.

So, how do I Implement this?

Usually, the hreflang link elements can be done by simply adding a piece of code into the header like this:

<link rel="alternate" href="http://site.com/" 
      hreflang="en" />
<link rel="alternate" href="http://site.com/es/" 
      hreflang="es" />
 

However, doing this can take a lot of development time so luckily we’ve found a way that makes it easy for anyone running their site on their own to do.

This method involves the use of the plugin HREFLANG Tags Lite.

This plugins helps you take care of the tedious task of adding these tags to each and every blog header by allowing you to manage the tags within each post.

First download the plugin.

Then enable “Posts” as a Content Type:

hreflang tags posts section

This will bring up the tags box within every post for you to edit.

Secondly, round up all blogs and their language alternatives; this will make it easier to keep track of which blogs need references to each other.

photo of a hreflang example

Then, through the plugin, first reference the original source and language. People often miss out the self-referencing tag, which is an important part of this process.

Then paste and label each alternative link and save.

Once you have done this, make sure that each language variation has the same process done so that each post is referencing the other.

Once this is completed, it’s important to test your new implementation and make sure it works. 

A quick way of doing this is through the tool Screaming Frog. If you run the website through the Crawler and Navigate to the “hreflang” section, you can get an overview of all pages with/without HREFLANG Tags:

screaming frog view of hreflang tags

This is a simple way of seeing if you’ve missed any tags and checking that the crawler is able to pick these things up.

To confirm this with Google, you can use the International Targeting section within search console.

google search console view of hreflang changes

As you can see, since implementation 96 Hreflang tags had been picked up, confirming that it was done correctly. Here you will also see errors such as missing tags from other posts incase you missed it initially.

It’s as simple as that, and great if you don’t have the development resource or time to implement Hreflang tags through other methods as mentioned in Yoasts brilliant hreflang tag guide .

This is a simple way of taking care of these tags and improving your international targeting! If you have any questions about SEO or want to learn more, get in touch!