4eck Media

How canonical tags improve your SEO strategy: Tips and mistakes

August 30, 2024
August 30, 2024

If you're involved in SEO, you've probably noticed that it's not just about keywords and backlinks. There are many technical aspects that are important and where there is not always clarity among all agencies, developers or SEOs - and one of these aspects is the topic of canonical URLs and canonical tags.

When is this an issue for you? You run a website with many subpages that are quite similar or even have the same content. This is often the case with online stores. Due to the proximity of content, it can happen that Google doesn't immediately know which page to index after crawling. The result? Google may determine the wrong page for indexing. Your ranking could suffer as a result. This is where canonical tags come into play.

In this post, I'll show you what canonical URLs and canonical tags are, why they're important, and how to use them correctly for your website. By the end, you'll understand how to avoid duplicate content and put your SEO strategy on a technically sound footing.

What are canonical URLs?

A canonical URL is the preferred version of a page that you want to communicate to search engines when there are multiple versions of the same or similar content.

Imagine you run an online store and have a product page that can be accessed via different URLs - for example

  • www.dein-xyz-shop.de/produkt1
  • www.dein-xyz-shop.de/produkt1?farbe=rot
  • www.dein-xyz-shop.de/kategorie/produkt1

Although it is basically the same page for the user, Google sees it differently: For the search engine, these are three different pages with possibly the same content. As a result, Google does not know exactly which of these pages should be displayed in the search results. The relevance is spread across several pages instead of focusing on just one. And you should avoid this from an SEO perspective. And that's what the canonical URL is for.

By marking one of these URLs as canonical, you tell Google which version is the original or main page that should be indexed. The other URLs are then treated as copies, which helps Google to display the correct page in the search results and not consider the duplicate pages as detrimental duplicate content. This helps your SEO performance.

Let's say you decide that www.dein-xyz-shop.de/produkt1 is the main version of your site. Then add a canonical tag to the other versions of the page (i.e. the URLs with "?color=red" and "/category/") that refers to www.dein-xyz-shop.de/produkt1. This makes it clear to Google which page you see as the main page and the search engine will concentrate on indexing it.

Canonical URL Tag

What are canonical tags?

The canonical tag is basically the tool you use to tell Google and other search engines which URL is the preferred or "canonical" version of a page.

A canonical tag is a piece of HTML code that you insert into the <head> section of your website. It looks something like this:

<link rel="canonical" href="https://www.dein-xyz.shop.de/produkt1" />

This tag tells the search engines: "Hey, no matter what URL this page is accessible under, the URL specified here is the one you should index." This allows you to ensure that Google does not display multiple versions of the same page in the search results, but instead focuses on your preferred version.

Placement in the HTML code

For example, if you have a page that is accessible under multiple URLs, insert the canonical tag in the `<head>` of the page you want to define as the main page. Here is a simple example:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="canonical" href="https://www.dein-xyz-shop.de/produkt1" /> <title>Product 1 - Your Shop</title> </head> <body> <!-- Page content --> </body> </html>

Google itself writes in its documentation: The rel="canonical" link element is only accepted if it appears in the <head> section of the HTML code. It is best to check your website to see whether a canonical tag is currently set and whether it is in the head section.

Imagine you have a product page for a red chair that is displayed in various categories on your website. Perhaps the page is available at the following URLs:

  • www.dein-xyz-shop.de/stuehle/rot
  • www.dein-xyz-shop.de/moebel/stuehle/rot
  • www.dein-xyz-shop.de/produkte/rot-stuhl

Although it's essentially the same page to the user, Google may see these as three different pages. To ensure that Google only sees one of these pages as the main page, insert the same canonical tag on all versions that points to your preferred URL, e.g:

<link rel="canonical" href="https://www.dein-xyz-shop.de/stuehle/rot" />

You use the complete absolute URL, including https! Google now knows that https://www.dein-xyz-shop.de/stuehle/blau is the main version and will preferentially display it in the search results.

As a rule, your CMS will do this work for you. It is best to check whether your system already sets canonicals by default or whether you still need to activate them in the settings or install a plugin specifically for this purpose.

When and why should you use canonical tags?

There are some typical use cases for canonical tags that make it clear why they are important.

1. parameters in URLs

If you run an e-commerce website (online store), you probably have URLs that contain various parameters, such as filter options, sorting or other functions that change the URL. For example:

  • www.dein-xzy-shop.de/produkt1?farbe=rot
  • www.dein-xyz-shop.de/produkt1?farbe=rot&size=m

Although the content of the page remains largely the same, Google sees each of these URLs as separate pages. With a canonical tag, you can tell Google that these different URLs refer to the same main content and avoid indexing each URL individually.

2. multiple versions of a page

It can happen that a website is accessible via different URLs, e.g:

  • http://www.dein-xyz-shop.de/produkt1
  • https://www.dein-xyz-shop.de/produkt1
  • http://dein-xyz-shop.de/produkt1
  • https://dein-xyz-shop.de/produkt1

Normally you solve this problem by setting up redirects from http to https and to your desired version (with or without www). Canonical tags are only important if the other pages should really exist, in order to refer to the preferred version.

3. content syndication

If you publish content on several websites, for example if a blog post is shared on a partner site or in a news portal, this content may be accessible under different URLs. In this case, you can place a canonical tag on the copied version that refers to the original. This ensures that Google sees your original page as the primary source and ranks it accordingly.

This is actually also an issue for us. Here on the agency blog, I would like to publish numerous articles on technical SEO, page speed optimization and code refactoring (JS/CSS) now and in the near future. These topics are just as interesting for our TutKit.com portal. As soon as these are also published on TutKit.com, I decide to reference the articles here in the agency blog with Canoncal tags to the TutKit URLs, because I want to strengthen the ranking there, while here they should primarily have an effect on our positioning as a tech agency.

Our headless CMS Strapi is set up so that the website automatically uses the self-referencing canonical URL, unless the field is filled out in the backend.

Content Syndication

The WordPress CMS does the same if you have installed the Yoast SEO plugin. Self-referencing URLs are always set. However, you have the option of specifying other canonical links in the backend when editing at the bottom of the Yoast SEO control panel displayed under Advanced.

Conclusion: Advantages of using canonical tags

Canonical tags are a simple and effective tool to strengthen your SEO strategy. They help you avoid duplicate content, make it clear to search engines which pages should be indexed, and ensure that your website reaches its full potential. Use them in the above scenarios to get your site to the top of the search results!

Best practices for implementing canonical tags

Now that you understand the basics of canonical tags and when they make sense to use, I want to give you some best practices to follow to make sure you're using canonical tags correctly and effectively.

1. self-referencing canonical tags

An important principle is that every page should have a self-referencing canonical tag. This means that each page refers to itself as the preferred version. This helps search engines to clearly understand that this page is the main version, even if they cannot find any other similar versions.

Example:

<link rel="canonical" href="https://www.deinshop.de/produkt1" />

Even if there are no duplicates, it is good practice to set this self-referencing canonical tag on all pages of your website. This avoids confusion and ensures that Google always indexes the correct URL. Normally, this is done automatically by the CMS you are using. However, you may have to install a plugin or module for this if the CMS does not provide it by default.

2. no use for paginated content

More or less a mistake is the use of canonical tags on paginated content. These are pages that are divided into several parts, e.g. blog archives or product lists. Some people place a canonical tag on every page that links to the first page in the series. This is problematic because Google then ignores all other pages, which can lead to problems with indexing.

Instead, you can use the rel="next" and rel="prev" attribute for paginated content to show Google that these pages form a series.

Zalando still uses self-referencing pagination for paginated product pages ... and is still very successful. All in all, it doesn't seem to be a hard factor that will cause your rankings to plummet if ignored.

Pagination mit Canonical Tag

Even pages that are further back are in the index ... here from the 50th page of the category:

Paginierte Seiten im Index

The About you online store, on the other hand, offers no pagination at all for the categories and thus avoids the problem. In our own project TutKit.com or our customer project Fischkaufhaus.de, we have also decided against pagination for category pages and list all the content of a category directly on one page.

3. canonical tags and hreflang

If you have a website that is available in several languages or for different regions, you may be familiar with the hreflang attribute. It's used to show Google which language or country version of your site should be displayed. Here I have a comprehensive guide to the hreflang attribute for you.

What many people don't know: Canonical tags and hreflang attributes can (and should) be used together. Each language version of your site should have a canonical tag that refers to the corresponding language or country version, not to a different language version. This way you avoid confusion and ensure that the correct page is displayed in the correct region. However, despite correctly implemented hreflang attributes and canonical tags, Google may select a page other than the canonical URL. Another blog post about this undesirable effect will follow shortly.

4. consistent use across the entire domain

Make sure that you use canonical tags consistently on all relevant pages of your website. Google prefers clear signals that leave little room for confusion or interpretation. If some pages have canonical tags and others don't, this can confuse search engines and potentially negatively impact your rankings.

5. be careful with redirects

If you use canonical tags together with 301 or 302 redirects, they must not be contradictory. If one page redirects to another, the canonical tag should also point to the final destination page, not to another URL. This ensures that Google knows exactly where the traffic should be directed.

Mistakes when implementing the canonical tag

There are a few stumbling blocks that can happen, but are better avoided to ensure your website works optimally for search engines.

The most common mistake is the incorrect implementation of the canonical tag. This often happens when the URL in the canonical tag is not specified correctly, e.g. due to typos, missing protocols (http vs. https), or when the URL points to the wrong page.

Example of an incorrect canonical tag:

<link rel="canonical" href="https://www.deinshop.de/Produkt1" /> <!-- Attention to upper and lower case -->

You can avoid implementation errors by ensuring that the URL in the canonical tag matches the preferred URL exactly, including capitalization, and pay attention to correct protocols and domains.

Test the canonical tag regularly with tools such as Google Search Console or an SEO crawler to ensure it is implemented correctly. For example, Seobility checks for canonical link errors. The screenshot currently shows no errors. At the top right you can see that there were 54 problems on 26.07.2024 after technical changes. Therefore, the use of regular crawling by SEO tools is always a monitoring tool for you, which ensures a high level of site hygiene and notifies you immediately of any problems. Errors will always occur sooner or later in large projects. So make sure you notice them.

Canonical Link Fehler

Another error occurs when multiple canonical tags are used on a page. This can happen if you use different plugins or CMS systems that automatically set canonical tags without taking into account that a tag already exists. Welcome to the wonderland of Klicki-Bunti WordPress themes, which can do everything and have all kinds of potential functions and applications and are so crammed with plugins ... something like this can happen.

Example:

<link rel="canonical" href="https://www.dein-xyz-shop.de/produkt1" /> <link rel="canonical" href="https://www.dein-xyz-shop.de/produkt1?farbe=rot" />

Google can get confused if it finds multiple canonical tags on the same page and might use the wrong tag or ignore both.

Check the source code of your pages to make sure there is only one canonical tag. And, as mentioned above, also use SEO tools that also check the correct implementation of canonical tags. If you are already using WordPress themes, limit yourself to the providers that have been around for a long time and are very popular. Based on thousands of user feedbacks, they have coordinated the plugins and CMS functions used so that they do not conflict with each other.

Sometimes the canonical tag is simply forgotten. This can be particularly problematic if your site has several URLs that display the same content. Without a canonical tag, Google could treat all of these URLs as separate pages, which can lead to duplicate content and potential ranking issues. Make sure you include a self-referencing canonical tag on all important pages of your website, even if you don't expect duplicates. Use SEO tools to regularly check that canonical tags are present on all your pages.

A common mistake is to put canonical tags on noindex pages. If you do not want a page to be indexed by Google, it should not have a canonical tag that points to an indexable page. This may be done automatically by your system. You probably know your typical pages that have the noindex attribute. One recommendation is to run the data protection page and also pages with terms and conditions/revocation on noindex so that these pages do not appear in Google if a pseudo consumer protection association searches for legal texts that can be used as a warning. You can then easily check whether your CMS or your framework also provides them with canonical tags or not.

Finally, a note: A canonical tag should only be used if the content of the pages is really identical or almost identical. If you place a canonical tag on pages with different content, you run the risk of valuable content not being indexed because Google thinks it is a duplicate.

Check the correct implementation of canonical tags

Once you have implemented canonical tags on your website, check that they are working correctly. There are a few methods and tools you can use to do this.

1. manually check the source code

The easiest way to check whether a canonical tag is set correctly is to manually inspect the source code of your page. You can do this directly in your browser. Right-click on the page you want to check and select "Show page source code" or "Inspect" (depending on your browser). See also the screenshot above of the Zalando source code view.

In the <head> area of the page you will find the canonical tag. It should look something like this:

 <link rel="canonical" href="https://www.dein-xyz-shop.de/produkt1" />

Here you can check whether the tag is present and whether the URL is correct. If you find the canonical tag in the <body> area of the page, it is an error. Google will not take it into account.

2. use Google Search Console

You can use the URL check in the Google Search Console to enter a URL and check whether the URL is indexed and the canonical tag is set correctly.

URL Prüfung in Search Console

The URL check via the Search Console is particularly useful as it shows you which URL Google actually considers to be canonical.

Use SEO tools

There are various SEO tools that also check the correct implementation of canonical tags. Above you have already seen a screenshot of the check from the SEO tool Seobility. Another tool that we use is the SEO crawler from Audisto. This clearly shows how many URLs contain canonical links, how many reference themselves and how many reference other URLs.

Audisto Hint Canonical Link

Other SEO tools are also able to check the canonical URLs and tags. There are also browser extensions that show you directly in the browser whether and how a canonical tag is set. For example, SEO Meta in 1 Click or the Web Developer Toolbar.

What happens if you don't set canonical tags?

On a small website, where there is only a little content and no categories that could organize the pages in different ways, you can do without canonical tags. As soon as categorizations, parameters or other elements are added that could result in page duplicates, canonical tags make sense. Even if you use content from here elsewhere, for example, canonical tags will be the method of choice for content syndication in order to determine the primary source for Google.

If you do not use canonical tags on your website, even though the creation of duplicate content cannot be ruled out, it can have several negative effects on your SEO:

  1. Without canonical tags, Google may not know which version of a page is the preferred one if the same content is available under multiple URLs. This can lead to Google considering these pages as duplicate content, which can negatively impact the rankings of the affected pages.
  2. If multiple URLs have the same content, the link power that comes to these pages through inbound links is distributed across all versions. This means that no single page receives enough link power to rank well. With canonical tags, you concentrate the link power on the preferred URL, which increases your chances of a better ranking.
  3. Google has a limited amount of crawl budget that it spends on each website. If Google has to crawl multiple similar or identical pages, the crawl budget can be wasted on these unnecessary duplicates instead of being used for important pages on your website.
  4. Without canonical tags, Google may not know exactly which page is the main version and which pages should be ignored. This can lead to poor indexing, where the most relevant or highest quality pages may not appear in search results.

You can never really rule out duplicate content. We have often experienced redirection problems and other types of duplicate content that we only became aware of after crawling through the SEO tools. Therefore, my recommendation: Have your CMS or framework automatically set self-referencing canonical tags for your pages. It's not a big one-off effort.

I hope this article is like a little guide to canonical tags & canonical URLs for you. Now you'll be able to implement canonical tags correctly to ensure that search engines understand and index your pages properly, which is the basis for better rankings. If you want more tips for a more effective SEO strategy, read our article.