What is the canonical tag?
First of all, we can't seem to agree on what to call it. Rest assured that 'rel canonical', 'rel=canonical', 'rel canonical tag', 'canonical url tag', 'link canonical tag' and simply 'canonical tag' all refer to the same thing.
The canonical tag is a page level meta tag that is placed in the HTML header of a webpage. It tells the search engines which URL is the canonical version of the page being displayed. It's purpose is to keep duplicate content out of the search engine index while consolidating your page’s strength into one ‘canonical’ page.
Lets look at a list of common duplicate content URLs.
http://example.com/quality-wrenches.htm (the main page)
http://www.example.com/quality-wrenches.htm
http://example.com/quality-wrenches.htm?ref=crazy-blog-lady
http://example.com/quality-wrenches.htm/print
How is it implemented?
The canonical tag is part of the HTML header on a webpage. This is the same place like the title tag. The code, as in my example above, would look like this.
<link rel="canonical" href="http://example.com/quality-wrenches.htm"/>
There is usually a better solution
The canonical tag is not a replacement for a solid site architecture that doesn’t create duplicate content in the first place.
Lets go through some of the URL examples I provided above, this time we'll talk about how to fix them without the canonical tag.
Example 1: http://www.example.com/quality-wrenches.htm
Common mistakes with rel=canonical
Mistake 1: rel=canonical to the first page of a paginated series
Imagine that you have an article that spans several pages:
example.com/article?story=cupcake-news&page=1
example.com/article?story=cupcake-news&page=2
and so on
Specifying a rel=canonical from page 2 (or any later page) to page 1 is not correct use of rel=canonical, as these are not duplicate pages. Using rel=canonical in this instance would result in the content on pages 2 and beyond not being indexed at all.
Mistake 2: Absolute URLs mistakenly written as relative URLs
The <link> tag, like many HTML tags, accepts both relative and absolute URLs. Relative URLs include a path “relative” to the current page. For example, “images/cupcake.png” means “from the current directory go to the “images” subdirectory, then to cupcake.png.”
Mistake 3: Unintended or multiple declarations of rel=canonical
Occasionally, we see rel=canonical designations that we believe are unintentional.
Mistake 4: Category or landing page specifies rel=canonical to a featured article
if you want users to be able to find both the category page and featured article, it’s best to only have a self-referential rel=canonical on the category page, or none at all.
Mistake 5: rel=canonical in the <body>
The rel=canonical link tag should only appear in the <head> of an HTML document. Additionally, to avoid HTML parsing issues, it’s good to include the rel=canonical as early as possible in the <head>. When we encounter a rel=canonical designation in the <body>, it’s disregarded.
