As websites expand their reach globally, serving content in multiple languages or regions becomes essential. But simply translating content isn’t enough Google must understand which version of your content to show to which user.
That’s where hreflang tags come in.
In this guide, you’ll learn:
- What hreflang tags are
- Why they matter for international SEO
- How to implement them correctly
- Common mistakes to avoid
- Google’s official recommendations and tools
What Are Hreflang Tags?
Hreflang is an HTML attribute used to tell Google which version of a webpage to show based on a user’s language and geographic location.
It helps solve:
- Duplicate content issues across language/region versions
- Incorrect page indexing (e.g., showing the French version to a US user)
- Improved user experience by serving the right content to the right audience
How Hreflang Works (Google’s View)
From Google:
“When Google detects different versions of the same page for different languages or regions, it uses hreflang annotations to serve the correct version to users.”
— Google Search Central
Hreflang Tag Syntax
htmlCopyEdit<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="es" href="https://example.com/es/" />
Common Language/Region Codes:
en
= Englishen-us
= English (United States)fr-ca
= French (Canada)ar
= Arabicur-pk
= Urdu (Pakistan)
Where to Place Hreflang Tags
You can implement them in three ways, according to Google:
Method | Placement |
---|---|
HTML <head> | On every individual page |
HTTP headers | For non-HTML files (e.g., PDFs) |
XML sitemap | Best for large websites with many versions |
Example for Two-Language Website (English and Urdu)
On the English page:
htmlCopyEdit<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="ur" href="https://example.com/ur/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/" />
On the Urdu page:
htmlCopyEdit<link rel="alternate" hreflang="ur" href="https://example.com/ur/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/" />
Note: x-default
is used as a fallback when no match is found for the user’s language or region.
Hreflang SEO Best Practices (According to Google)
- Implement Bidirectional Linking
Each page must reference all versions of itself, including itself. - Use Correct Language and Country Codes
Use ISO 639-1 for language and ISO 3166-1 Alpha 2 for region. - Avoid Using Canonical Tags Across Languages
Each language version should canonicalize to itself. - Keep URLs Consistent
Ensure URLs listed in hreflang are live and not redirected. - Don’t Use the International Targeting Report
Google has officially deprecated the International Targeting report in Search Console.
Hreflang tags are still fully supported, but Search Console’s country targeting tool is no longer available.
Source: Google Support
Real-World Scenario
A Pakistani e-learning platform had English and Urdu versions of their course pages. Initially, Google indexed the English version only, even for users in Pakistan searching in Urdu.
After implementing hreflang correctly:
- Urdu pages started appearing for Urdu search queries
- Bounce rate dropped by 21%
- Organic impressions increased by 31% in Pakistan
Common Mistakes to Avoid
Mistake | Impact |
---|---|
Missing reciprocal hreflang links | Google may ignore the annotations |
Incorrect country/language codes | Tag becomes invalid |
Linking to broken or redirected URLs | Google skips the tag |
Canonicalizing different language versions together | Confuses indexing decisions |
Tools to Test Hreflang
- URL Inspection Tool (to verify indexing of localized versions)
- Chrome DevTools (inspect
<head>
section manually) - Third-party hreflang testers like hreflang.org or Aleyda Solis’ hreflang checker
Summary Checklist
- Use hreflang in
<head>
or XML sitemap - Use correct ISO language/region codes
- Ensure bidirectional hreflang annotations
- Self-canonicalize each language version
- Avoid broken or redirected URLs in hreflang
- Include
x-default
for fallback - Test manually with DevTools or trusted third-party tools
- Use URL Inspection Tool to confirm indexed versions