What Is a Canonical Tag?
A canonical tag is an HTML <link> element in the <head> of a page that tells search engines which URL is the authoritative, "real" version of that content:
<link rel="canonical" href="https://www.example.com/pricing" />It exists because the same content is often reachable at more than one URL: with and without a trailing slash, with and without www, with tracking parameters, with different capitalization, or duplicated across print-friendly and mobile versions. Instead of splitting ranking signals across all of these variants, the canonical tag tells search engines "consolidate everything here."
Canonical tags are a hint, not a directive — search engines usually respect them, but can override a canonical tag if other signals (like a majority of inbound links, or a sitemap entry) point elsewhere. That's different from a 301 redirect, which is a hard instruction the browser and search engine both have to follow.
What Is Hreflang?
The hreflang attribute tells search engines which URL to serve to users based on their language and region. It's used on sites that publish the same content in multiple languages or regional variants — for example a company with /en-us/, /en-gb/, and /fr-fr/ versions of the same page.
<link rel="alternate" hreflang="en-us" href="https://example.com/en-us/pricing" />
<link rel="alternate" hreflang="en-gb" href="https://example.com/en-gb/pricing" />
<link rel="alternate" hreflang="fr-fr" href="https://example.com/fr-fr/pricing" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en-us/pricing" />The value is an ISO 639-1 language code, optionally combined with an ISO 3166-1 Alpha-2 region code (en-us, fr-ca, pt-br). The special value x-default marks a fallback page to show when none of the other language/region tags match the visitor.
Hreflang tags can live in three places: <link> elements in the page <head> (most common), entries inside sitemap.xml using the xhtml:link namespace, or an HTTP Link header for non-HTML resources like PDFs.
Hreflang Must Be Reciprocal
Every page in an hreflang cluster must link to every other page in the cluster, including itself. If /en-us/pricing links to /fr-fr/pricing via hreflang, but /fr-fr/pricing doesn't link back to /en-us/pricing, the annotation is incomplete and search engines may disregard it entirely. This trips people up constantly — a common bug is updating the hreflang set on one locale's template but forgetting to redeploy the others.
Where Canonical and Hreflang Conflict
Here's the mistake that breaks more hreflang setups than anything else: pointing every locale's canonical tag at a single "main" version instead of at itself.
Wrong
On /fr-fr/pricing: <link rel="canonical" href="https://example.com/en-us/pricing" />
This tells search engines "the French page is a duplicate of the English page — index the English one instead." That directly contradicts the hreflang annotation, which is saying "show French users this exact French URL." When canonical and hreflang disagree, search engines generally trust the canonical tag and may drop the French page from the language-specific results entirely — defeating the whole point of localizing the content.
Correct
On /fr-fr/pricing: <link rel="canonical" href="https://example.com/fr-fr/pricing" /> (self-referencing)
Each localized URL should canonicalize to itself. This is the one rule that prevents almost every hreflang/canonical conflict: every page in an hreflang cluster gets a self-referencing canonical, full stop. The hreflang tags handle telling search engines about the other language versions; the canonical tag just confirms "this page is not a duplicate of anything, index it as-is."
Implementation Checklist
- Self-referencing canonical on every localized page. Never point a translated page's canonical at another language.
- Full reciprocity. Every URL in the cluster links to every other URL, including itself, with matching hreflang values on every page.
- Include x-default. Set a sensible fallback for visitors whose language/region doesn't match any specific variant.
- Use absolute URLs. Both canonical and hreflang href values should be full URLs (
https://...), not relative paths. - Match protocol and domain consistently. If your canonical URL is
https://www.example.com/..., every hreflang alternate should also resolve onhttps://www., not a mix of apex and www. - Verify with Search Console. The International Targeting report (or URL Inspection tool) flags hreflang errors like missing return links or conflicting canonicals.
The Same Principle Applies to Apex vs WWW
The underlying idea behind canonical tags and hreflang — pick one authoritative URL and make every signal agree with it — is exactly the same principle behind choosing apex or www as your canonical domain. If you decide www.example.com is canonical, every reference to your site should agree: the apex domain should 301-redirect to www, your canonical tag should point at the www URL, and your sitemap should list www URLs. Redirecting apex to www but self-canonicalizing the apex version (or vice versa) creates the identical kind of conflicting signal that breaks hreflang setups — just at the domain level instead of the locale level.
A properly configured single-language site like most small SaaS products doesn't need hreflang at all — it only becomes relevant once you're serving genuinely different content (translated copy, region-specific pricing) at different URLs. But the canonical tag matters on every site, single-language or not, because apex/www duplication and trailing-slash duplication happen regardless of how many languages you support.
Frequently Asked Questions
What is a canonical tag?
A canonical tag (rel="canonical") is an HTML link element that tells search engines which URL is the authoritative version of a page when duplicate or near-duplicate content exists at multiple URLs. It consolidates ranking signals onto the canonical URL instead of splitting them across duplicates.
What is hreflang used for?
Hreflang is an HTML attribute that tells search engines which URL to show users based on their language and region. It's used on sites that publish the same content in multiple languages or regional variants, so a French speaker in France sees the /fr-fr/ version instead of the default /en/ page.
Should hreflang pages have a self-referencing canonical?
Yes. Each URL in an hreflang cluster should have a canonical tag pointing to itself, not to another language version. Pointing canonical at a different URL tells search engines to deindex the current page in favor of another, which directly conflicts with hreflang's purpose of keeping every language variant indexed and served to the right audience.
Do hreflang tags need to be reciprocal?
Yes. Every page in an hreflang cluster must link to every other page in the cluster, including a self-referencing link back to itself. If page A links to page B via hreflang but B doesn't link back to A, search engines may ignore the annotation entirely.
Does hreflang affect apex domain vs www redirects?
Not directly, but the underlying principle is the same: pick one canonical URL per piece of content and make every other variant point to it, either via a 301 redirect (apex to www) or a canonical tag (duplicate/localized content). Mixing signals — for example redirecting apex to www but self-canonicalizing the apex version — creates the same kind of conflict hreflang misconfiguration does.
Get your apex/www canonical signal right in one step
ApexToWWW 301-redirects your apex domain to www with two DNS records — free, automatic SSL, no signup required.
Get Started Free