What is Canonical URL? How to Use It Correctly for SEO

What is Canonical URL?

Canonical URL is an HTML tag used to tell search engines like Google which version of a web page is the "preferred" or "official" version. When a page has multiple URLs pointing to the same content or when content is duplicated across different URLs, the canonical tag helps Google identify which URL should be indexed and displayed in search results.

The canonical tag is declared in the <head> section of the HTML code with this syntax:

<link rel="canonical" href="https://example.com/preferred-url" />

In reality, many websites can have different versions of URLs for the same content due to various reasons:

WWW and non-WWW URLs: www.example.com and example.com
HTTP and HTTPS: http://example.com and https://example.com
URLs with trailing slash: example.com/page and example.com/page/
URLs with parameters: example.com/product?id=123 and example.com/product
Mobile versions: m.example.com and example.com

Without a canonical tag, Google has to guess which URL is the main version, which can lead to indexing the wrong URL or splitting SEO value (link juice) across multiple versions, reducing overall SEO effectiveness.

To learn more about URL structure and optimization, check out our article on What is URL?.

Why Canonical URL is Important for SEO

Canonical URLs play a crucial role in any website's SEO strategy. Here are the main reasons why you need to pay attention to canonical tags:

Preventing Duplicate Content Issues

One of the biggest problems websites face is duplicate content. When Google detects multiple pages with the same content, its algorithm may evaluate this as unnatural behavior and apply penalties. The canonical tag helps you clearly specify which version is the official one, avoiding negative Google evaluations. To learn more about duplicate content and how to fix it, check out our article What Is Duplicate Content?.

Important note: Google recommends using canonical tags instead of 301 redirects in certain situations, especially when you need to maintain multiple URL versions for different purposes (such as tracking marketing campaigns).

To learn more about common SEO errors and how to fix them, check out our SEO Checklist for Website.

Concentrating SEO Value (Link Juice)

When there are multiple URL versions of the same content without canonical tags, the SEO value (also known as Link Juice) gets distributed across all these versions. This means your keyword rankings will decrease because the SEO value isn't concentrated on a single URL.

When using canonical tags correctly, all SEO value from links pointing to all URL versions will be concentrated on the canonical URL, helping improve search rankings more effectively.

Optimizing Crawl Budget

Crawl Budget is the number of pages Googlebot can crawl within a specific time frame. When your website has too many duplicate URL versions, Googlebot will waste crawl budget on unnecessary pages.

Using canonical tags helps Googlebot understand that other versions are just copies, so it can focus on crawling the canonical URL and save crawl budget for other pages on your website.

Ensuring Correct Display in Search Results

Without canonical tags, Google may choose any version to display in search results. This could lead to the situation where the displayed URL isn't the version you want. For example, Google might display the HTTP version instead of the HTTPS (more secure) version, or display the www URL instead of non-www.

Canonical tags ensure your preferred URL will be displayed in search results, helping maintain consistent brand image and better user experience.

Supporting Marketing Strategies

In marketing campaigns, you often create URLs with tracking parameters (UTM parameters) to analyze campaign effectiveness. These URLs create different versions of the same page. By using canonical tags pointing to the original URL, you can safely use tracking URLs without worrying about SEO impact.

How to Implement Canonical URL

There are several ways to implement canonical tags, depending on the platform and system you're using. Here's a detailed guide for each method:

Adding Canonical Tag in HTML

The simplest way is to add the canonical tag directly in the <head> section of each page's HTML:

<!DOCTYPE html>
<html>
  <head>
    <link rel="canonical" href="https://example.com/preferred-url" />
    <title>Page Title</title>
  </head>
  <body>
    <!-- Page content -->
  </body>
</html>

Important principles when using canonical tags in HTML:

Use absolute URLs: Always use complete URLs including protocol (http or https), for example: https://example.com/page
URL must be accurate: The URL in the canonical tag must point to the current page or the desired preferred version
Don't use redirect: Canonical tags are not redirects; users can still access other versions
One canonical per page: Each page on your website should have a canonical tag pointing to itself or the preferred version

Adding Canonical URL in HTTP Headers

For non-HTML files (such as PDF, images...), you can set canonical URLs through HTTP headers:

Link: <https://example.com/document.pdf>; rel="canonical"

This method is especially useful for downloadable documents and media content.

Setting Up Canonical URL in WordPress

If you're using WordPress, there are several ways to set up canonical URLs:

Method 1: Using SEO Plugins (Yoast SEO or Rank Math)

Install and activate Yoast SEO or Rank Math plugin
The plugin will automatically set canonical tags for pages
You can customize the canonical URL in the plugin settings

Method 2: Setting canonical URL in WordPress Settings

Go to Settings > General
Set WordPress Address (WordPress Address) and Site Address (Site Address) the same
This ensures WordPress uses a single URL

Method 3: Using All in One SEO Plugin

All in One SEO plugin provides global canonical URL settings
You can customize canonical URL for each specific post/page

To learn more about WordPress SEO optimization, check out our article on WordPress SEO.

Setting Up Canonical URL in Next.js/React

If you're using Next.js, you can set up canonical URLs through the Head component or metadata API:

import Head from 'next/head';

export default function Product() {
  return (
    <>
      <Head>
        <link rel="canonical" href="https://example.com/product" key="canonical" />
      </Head>
      {/* Page content */}
    </>
  );
}

Or use the metadata API in Next.js 13+:

export const metadata = {
  alternates: {
    canonical: 'https://example.com/product',
  },
};

To learn more about SEO in Next.js, check out our article on ReactJS SEO.

Setting Up Canonical URL in Nginx

In Nginx, you can use the add_header directive to add canonical tags:

server {
    server_name www.example.com example.com;

    # Add canonical tag for all pages
    add_header Link '<https://example.com$request_uri>; rel="canonical"';

    # Or use map to create dynamic URLs
    map $uri $canonical {
        ~^/(.*)$1;
    }
}

Setting Up Canonical URL in Apache

In Apache, you can use .htaccess:

# Add canonical tag to all pages
<IfModule mod_headers.c>
    Header set Link "<https://example.com%{REQUEST_URI}>; rel=\"canonical\""
</IfModule>

Common Use Cases

Canonical URLs can be used in many different situations. Here are the most common use cases:

HTTP to HTTPS

When transitioning your website from HTTP to HTTPS, you should set canonical tags on all HTTP pages pointing to the corresponding HTTPS version:

<link rel="canonical" href="https://example.com/page" />

This ensures that SEO value from links pointing to the HTTP version is transferred to the more secure HTTPS version.

To learn more about website security and HTTPS, check out our article on What is HTTPS?.

WWW to Non-WWW

Similarly, when choosing to use either www or non-www version, set up the canonical tag appropriately:

If you want to use the non-www version: example.com
Add canonical tag: <link rel="canonical" href="https://example.com/page" />

URLs with Parameters

When using URLs with tracking parameters (UTM parameters), set up the canonical tag pointing to the original URL without parameters:

<!-- URL: example.com/product?utm_source=facebook -->
<link rel="canonical" href="https://example.com/product" />

URLs with Trailing Slash

Some pages may be accessible both with and without trailing slash. To be consistent, set up the canonical tag for one version only:

<!-- Both URLs have this tag: -->
<!-- example.com/page -->
<!-- example.com/page/ -->
<link rel="canonical" href="https://example.com/page/" />

Content on Multiple URLs

In some cases, you may intentionally place the same content on multiple URLs (e.g., versions for different languages or categories). Canonical tags help specify the preferred URL:

<!-- Suppose same content on both URLs: -->
<!-- example.com/category/product-a -->
<!-- example.com/product/product-a (duplicate error) -->

<!-- On example.com/product/product-a, add: -->
<link rel="canonical" href="https://example.com/category/product-a" />

Printer-Friendly Version

If your website has a printer-friendly version, set up the canonical tag pointing to the original version:

<!-- URL: example.com/product/print -->
<link rel="canonical" href="https://example.com/product" />

Common Mistakes and How to Fix Them

When using canonical tags, there are some common mistakes you need to avoid:

Canonical URL Points to Wrong Page

Mistake: Canonical tag points to a non-existent URL or not the preferred version.

How to fix: Always check that the URL in the canonical tag exists and is the version you want to use. Ensure the URL is correct, including protocol (http/https) and www/non-www.

Using Redirect Instead of Canonical

Mistake: Using 301 redirect instead of canonical tag when you need to keep multiple URL versions.

Explanation: A 301 redirect will redirect users and Googlebot to the new URL, while a canonical tag only signals the preferred URL but still allows access to other versions. Use redirects when you really want to redirect, and use canonical tags when you need to keep multiple versions.

Missing Canonical Tag on Some Pages

Mistake: Adding canonical tags only on some pages while ignoring others.

How to fix: Ensure all pages on your website have appropriate canonical tags. This includes homepage, category pages, product pages, blog posts, etc.

Relative URLs Instead of Absolute URLs

Mistake: Using relative URLs in canonical tags instead of absolute URLs.

How to fix: Always use absolute URLs including full protocol and domain:

✅ <link rel="canonical" href="https://example.com/page" />

❌ <link rel="canonical" href="/page" />

Canonical URL Points to Different Page

Mistake: Canonical tag points to a different page from the current content.

Explanation: This can confuse Google and negatively impact SEO. Each page should have a canonical tag pointing to itself or its preferred version.

Missing HTTPS on Preferred Version

Mistake: Website has moved to HTTPS but the HTTP version still exists without canonical tags.

How to fix: Ensure all HTTP pages have canonical tags pointing to the corresponding HTTPS version.

Tools to Check Canonical URL

To check and verify canonical tags on your website, you can use the following tools:

Google Search Console

Google Search Console is Google's free tool that helps you monitor and manage your website's presence in search results. In the URL inspection section, you can see which URL is being indexed and how the canonical tag is set up.

How to use:

Access Google Search Console
Enter the URL of the page you want to check
View information in Indexing > Indexed URL
Check the User-declared canonical URL section

Google Rich Results Test

The Google Rich Results Test tool helps you check whether a page is valid for Rich Results, while also displaying the canonical tag if present.

How to use:

Access Google Rich Results Test
Enter the URL to check
View results including the canonical tag

Online SEO Checker Tools

Many online SEO tools provide canonical tag checking features:

Ahrefs Webmaster Tools: Check canonical tags and detect duplicate content issues
Semrush: Comprehensive technical SEO analysis including canonical URLs
Moz Pro: Check canonical URLs and other SEO issues
Screaming Frog SEO Spider: Desktop tool for batch website page checking

Manual Check

You can manually check canonical tags by viewing the page source:

Open the web page in your browser
Right-click and select View Page Source (or Ctrl+U)
Search for <link rel="canonical"
Check if the URL in the tag is correct

Site Audit with Technical SEO Tools

If you're conducting a comprehensive SEO audit, check for these canonical URL-related issues:

Missing canonical tags on important pages
Canonical tags pointing to wrong URLs
Multiple URL versions without canonical tags
Inconsistent http/https canonical URLs

To learn more about technical SEO auditing, check out our article on Overall SEO.

Frequently Asked Questions About Canonical URL

What's the Difference Between Canonical URL and 301 Redirect?

Canonical URL and 301 redirect serve different purposes:

Criteria	Canonical URL	301 Redirect
Function	Specifies preferred URL	Redirects to new URL
User Experience	Users can still access other versions	Users are automatically redirected to new URL
Use When	Need to keep multiple URL versions	Want to permanently move to new URL

Use canonical URLs when you need to track multiple versions (like URLs with UTM parameters), and use 301 redirects when you want permanent redirection.

Should I Point Canonical URL to Homepage?

Yes, if you have multiple versions of the same content. However, each page should have a canonical tag pointing to itself or its preferred version, not the homepage (unless the content is actually the homepage).

Are Canonical URLs Affected by Noindex?

Yes, if a page has both <meta name="robots" content="noindex"> and a canonical tag pointing to another page, Google will prioritize the noindex directive. However, to avoid confusion, you should:

Not use noindex on pages with canonical tags pointing to other pages
Ensure canonical tags point to indexed pages

Do SEO Plugins Automatically Add Canonical URLs?

Yes, most popular SEO plugins like Yoast SEO, Rank Math, and All in One SEO automatically set up canonical tags for pages. However, you should check and customize if needed.

Do Canonical URLs Affect Sitemap?

Not directly. However, in your XML Sitemap, you should include the canonical version (URL specified in the canonical tag) and not include other duplicate versions.

Can I Use Relative Canonical URLs?

Not recommended. Google recommends using absolute URLs (including protocol and domain) to avoid confusion. For example:

✅ <link rel="canonical" href="https://example.com/page" />

❌ <link rel="canonical" href="/page" />

Conclusion

Canonical URL is an important technical element but often overlooked in SEO strategy. Using canonical tags correctly helps:

Prevent duplicate content issues and avoid negative Google evaluations
Concentrate SEO value (link juice) on a single canonical URL
Optimize crawl budget and help Googlebot crawl more effectively
Ensure correct URL display in search results

Make sure all pages on your website have canonical tags set up correctly, and regularly check using tools like Google Search Console to ensure everything works properly.

To check other comprehensive technical SEO factors, check out SEO Checklist for Website.