Hreflang Guide for Beginners
Most companies target more than one market.
This requires that websites be tailored to meet the needs of users around the world, which often means that there are multiple lingual and regional versions of the same site.
However, with multiple versions, Google can sometimes show a page that doesn’t match the visitor’s preferred language, region, or currency, which can frustrate your users and ultimately deplete your conversions.
Here, we discuss how to help your site serve content according to user preference using hreflang tags.
What is an hreflang tag?
An hreflang tag is a piece of code that helps Google direct users to the most appropriate version of your site based on their preferred language, region, currency, etc.
How do I implement an hreflang tag?
There are 3 areas to input an hreflang tag:
- HTML
- HTTP headers
- Sitemap
But if you are new to hreflang, you‘ll probably find that implementing hreflang tags in HTML is the quickest and easiest, so that’s what we’ll share here.
For HTML, you’ll need to add the hreflang to the code of your web page in the <head> tag and in the following format:
<link rel=”alternate” hreflang=”lang_code” href=” http://example.com/” />
Please note that when you are writing the hreflang code, you must use the language (in ISO 639-1 format) and country code (in ISO 3166-1 Alpha 2 format) provided by Google. Do not randomly make up the country or language code, because Google won’t understand.
How do I add hreflang to desktop and mobile?
If you have two separate URLs for your desktop and mobile sites (as shown in the example below), then you must add the hreflang tag to both sites.
- Desktop site: https://www.example.com
- Mobile site: https://m.example.com
If you only add the hreflang tag to your mobile site, then your desktop visitors will not be served their preferred content, and vice versa.
How do I set a default page using the x-default tag?
If no version of your site matches the user’s browser setting for preferred language/region, you can use the x-default hreflang tag to signal to Google to point users to a default page.
For example, English is an international language, so you might want users from certain countries to access the English landing page. In this case, you can use the x-default tag and set the English page as your default page, so whenever the user’s preferred language/region does not exist in the hreflang tag, users will be pointed to your English landing page.
When you add the x-default hreflang to your HTML, follow the format that Google suggests:
<link rel=”alternate” href=”http://example.com/” hreflang=”x-default” />
***
In short, it is more likely that your content will meet user need for language, region, and currency using hreflang. Hreflang assists Google in directing visitors to the most appropriate version of your site based on user preference, ultimately facilitating more conversions.
