Canonical Tag is an HTML element that is used to prevent duplicate content issues. It specifies the canonical URL "the preferred version" of a web page and tells search engines that the other similar URLs are not different or duplicates; they are one and the same. See the following example of product page duplication of an e-commerce company;
In the image shown above, there are three product pages for the same product "yellow toy car". These pages have the same content except the breadcrumb links. So, with the help of canonical tag we can mark one page as canonical version and eliminate two of the copies.
In the above image, using canonical tag we have informed the search engine to consider the page located at [ http://www.example.com/toys/cars/yellow] as original page and the other two URLs as variations of the original page.
So, if your site displays the same content on multiple URLs, then by using canonical tag you can select the one URL as canonical version and can clear that other URLs are not the duplicates. See one more example given below:
Now, to show the main page as canonical version, we can place a canonical tag that references the main page( http://www.example.com) in the header of the other two URLs. See the related image shown below;
How to apply a canonical tag?
You can apply this tag by adding a link tag to the head of the HTML code of the page that you want to be recognized as canonical by the search engine, e.g. to designate www.javatpint.com with the canonical tag, the code will look like as shown below;
How canonical tag helps improve SEO of a site
It is very helpful in cases when you have multiple similar versions of a page or your content is accessible through multiple URLs. It enables you choose one version as canonical URL; you can create canonical URL for each set of similar URLs. After your canonical tag is ready, the search engine will consider all the links to similar versions as links to the canonical version that helps improve SEO of your site.