Not one of the most fascinating areas of SEO, but an important one nonetheless. Canonical tags are often overlooked by webmasters and, depending on the nature and structure of your website, this can cause you to face serious negative consequences in search engines.
We’d always recommend having some form of canonical tag live on every page, but before we get in to that…
What is a canonical tag? How do they work? When should I use them? What on earth is a self-referencing canonical tag?
I’ll try to answer all of those nagging questions and fill your gaps of knowledge as best I can throughout this post. Also, you can download a free tool if you stick around to the end (or just skip there right now).
Contents
- What is a canonical tag?
- What does a canonical tag look like?
- How do canonical tags work?
- When should I use a canonical tag?
- What’s a self-referencing canonical tag?
- When should I use a self-referencing canonical tag?
- Canonical Tag Generator Tool download
What is a canonical tag?
A canonical tag is a piece of code you insert in to the HTML of your web page to point search engines to the correct version of that page.
What does a canonical tag look like?
There’s a couple of different ways to format a canonical tag, but they all do the same thing. Below is the format we tend to use:
<link rel=”canonical” href=”https://www.example.com/“/>
Obviously the https://www.example.com/ is where you input the desired URL.
How does a canonical tag work?
A canonical tag works by telling the relevant search engines that are crawling the page that “actually this isn’t the page you’re looking for.”
“Instead, please can you ignore me and look at this other page instead? I’ve even provided the URL to the other page in this lovely href tag. No you’re the best!” Sorry, I’m getting carried away now.
For example, if I want a search engine to ignore URL A and instead acknowledge URL B I would implement the below canonical tag on the URL A.
<link rel="canonical" href="B"/>
When should I use a canonical tag?
We’d recommend always using a canonical tag of some description in every page of your website (more on that later). However, the most critical circumstances in which you should use a canonical tag are as follows:
Your website utilises URL variants to serve up different versions of a single web page, but you only want the main page being indexed in the search engine.
For example, if I were a clothing retailer and have a category page for handbags my URL might read:
example.com/handbags/
Usually, there’d be a choice of filters for colour, material etc on that page and when you select these the URL might change to:
example.com/handbags/green/leather/
Now, that’s just one variant and there could potentially be hundreds which will clog up the search results, so you’d only want search engines to index and serve the root category page which as we’ve established is example.com/handbags/.
Therefore, you’d implement the below canonical tag on the example.com/handbags/green/leather/ URL or any other filter variant:
<link rel="canonical" href="example.com/handbags/"/>
It’s best practice to do this to avoid using up Google’s crawl budget. A “crawl budget” refers to how many pages of your website a search engine will read before moving on.
By inefficiently using up a crawl budget, you can negatively impact the efficiency of site-wide website crawling and as a result your rankings might suffer.
Aside from crawl budgets, it’s best practice to implement a canonical tag to ensure you’re properly meeting your user’s search intent by providing a relevant and content-rich landing page.
You use UTM tracking as part of your marketing campaigns and these URLs are being indexed by search engines.
UTM tracking is a way to measure campaign performance. For example, you might run an email marketing campaign which links to a landing page on your website. Great! You want to add UTM tracking on that URL so you can measure its performance in Google Analytics. Greater! This means you have to append the original URL with a parameter so Google Analytics can detect and segment any traffic coming from it.
So for example, you might be a clothing retailer running an email marketing campaign that targets the handbags section of your website (starting to see a pattern here?) which means the original URL with no parameters will look like this:
example.com/handbags/
However, when you add the appropriate URL parameters to this URL it will look like this:
example.com/handbags?utm_source=email&utm_medium=banner&utm_campaign=handbagflashsale
Everything from the question mark onwards is what’s called a UTM parameter and sometimes search engines can index this URL variant as its own page.
Therefore, to avoid duplicate content flags and unnecessarily using up the search engine’s crawl budget, the natural course of action is to implement a self-referencing canonical tag on the main URL. This is to assure search engines that this variant of the URL is the correct one and to ignore any others.
So in this example, the below tag would go in to the HTML of the example.com/handbags/ URL.
<link rel="canonical" href="example.com/handbags/"/>
There’s 2 or more pages on your website that are indentical in content
Sometimes we find that clients have multiple versions of the same page live on their website. This can be due to a variety of reasons, such as the business wanting a ‘vanity’ URL to a landing page as part of a marketing campaign.
This can be a cause for concern as you can be flagged for duplicate content and also unnecessarily use up a search engine’s crawl budget.
In this instance, we’d always recommend setting up a 301 (permanent) redirect from any and all vanity URLs to the original URL, add a NoIndex tag to the vanity URL and, to avoid it being crawled and indexed in search engines, setting up the appropriate canonical tag back to the primary version of the URL.
So for example, I’ve set up a vanity URL for the handbags page of my website (no surprise there) which is:
example.com/vanity
And the main page URL is:
example.com/handbags
I’d set up the below canonical tag on the example.com/vanity URL:
<link rel="canonical" href="example.com/handbags/"/>
This is so search engines can recognise that this isn’t the main version of the page and to instead crawl the handbags page instead.
What is a self-referencing canonical tag?
A “self-referencing” canonical tag is a canonical tag which references the URL of the page it’s on. Pretty much exactly what it says on the tin. Most CMS platforms allow you to set this up by default with the use of plugins, but others may require more attentive development work.
When should I use a self-referencing canonical tag?
A self-referencing canonical tag should be used on every page of your website by default. This is to protect any other variant of that page (i.e. if you use URL parameters) from being crawled and indexed in search engines, which can not only cause duplicate content flags but unnecessarily use up Google’s crawl budget.
Is there an easy way to generate canonical tags?
This is the part where I go “Ha ha well I’m so glad you asked!” in a cheesy TV advert way. But in all seriousness, I’ve created a really simple tool which allows you to generate these tags in bulk which could save you buckets of time.
Feel free to download it here!
Thanks a lot for reading about canonical tags, I hope you’re still awake and that your understanding of canonical tags is far superior now than it was before.
