Synonyms: Language targeting tag
Hreflang is an HTML attribute used to specify the language and regional targeting of a webpage to search engines. It helps search engines like Google understand which version of a webpage to show to users based on their language or geographical location. For example, if you have different versions of a website for English-speaking users in the US and Spanish-speaking users in Spain, the hreflang attribute tells search engines which version to display to the appropriate audience.
Why is Hreflang Important?
The hreflang attribute is especially important for multilingual and multiregional websites. It ensures that search engines serve the correct version of a page to the right users. Without the hreflang attribute, search engines might show the wrong language or country-specific version, which can lead to a poor user experience and affect SEO rankings.
Key Benefits of Hreflang:
- Improves user experience: Ensures users see the content in their preferred language and tailored to their region.
- Prevents duplicate content issues: Having similar content in different languages could be considered duplicate content by search engines. Hreflang helps differentiate the content for each language or region.
- Increases SEO relevance: By correctly targeting users with the right version of a webpage, you enhance your site’s relevance and search engine performance in different languages and regions.
How Does Hreflang Work?
The hreflang attribute is added to the HTML <head>
section of a webpage or in the sitemap, and it specifies the language code and optional region code. The syntax uses ISO language codes (e.g., “en” for English, “es” for Spanish) and region codes (e.g., “US” for the United States, “ES” for Spain).
Hreflang Syntax Example:
Here’s an example of hreflang markup for a website with English (US) and Spanish (Spain) versions:
<link rel="alternate" href="https://example.com/en-us/" hreflang="en-us">
<link rel="alternate" href="https://example.com/es-es/" hreflang="es-es">
In this example:
- “en-us” targets English-speaking users in the United States.
- “es-es” targets Spanish-speaking users in Spain.
Language and Region Codes:
- Language code: Specifies the language (e.g., “en” for English, “fr” for French).
- Region code (optional): Specifies the country or region (e.g., “US” for the United States, “FR” for France). This is useful for regional targeting, like showing British English vs. American English content.
x-default Hreflang:
The x-default hreflang attribute is used to specify a fallback page when no specific language or region match is found. For example:
<link rel="alternate" href="https://example.com/global/" hreflang="x-default">
This tells search engines to serve this page if none of the other language or region versions fit the user’s preferences.
Hreflang Best Practices
- Use consistent URLs: Ensure that each language or regional version of the page has a unique URL.
- Mutual linking: Each version of the page should reference all other versions, including itself, in the hreflang tags.
- Test regularly: Use tools like Google Search Console or third-party tools to ensure your hreflang tags are set up correctly and working as expected.
Common Mistakes to Avoid
- Incorrect language or region codes: Always use the proper ISO codes for both language and region to avoid errors.
- Missing hreflang for self-referencing: Each page should include a hreflang tag for itself to avoid issues with search engine indexing.
- Not using x-default: If you have a global page that serves users regardless of their location, using the x-default attribute can help ensure it’s properly indexed.
The hreflang attribute is essential for websites targeting multiple languages or regions, helping to ensure that the right content reaches the right users, improving both user experience and SEO.