: Case for and against different URLs for rel="canonical" and og:url meta tags I am trying to decide whether it is a good idea to use different URLs for the rel="canonical" and open graphs og:url

@Alves908

Posted in: #CanonicalUrl #Ecommerce #OpenGraphProtocol #Products #Seo

I am trying to decide whether it is a good idea to use different URLs for the rel="canonical" and open graphs og:url links in the following use case:

A pretty standard product page: www.smithandcanova.co.uk/aspen/449-double-zip-top-washbag.html
As with many fashion products they come in a number of different colour options. In this case Brown or Black. The default colour currently set is brown. As such travelling to the main link above will take you to the page displaying images of a (mighty fine if I don't say so myself) wash bag in brown.

To improve the experience when linking from external pages (category specifically) I have added the ability to include a parameter on the end of the url to give users a landing page specific to their choice of colour e.g.:
www.smithandcanova.co.uk/aspen/449-double-zip-top-washbag.html?color=black
This will load the same page except that the product will display in black rather than brown as with the original link. Brown can be returned to by changing the colour drop down on the page.

Now the issue:

rel="canonical"

It seems a bit of a no brainer to use the root URL (449-double-zip-top-washbag.html) For the rel="canonical" header tag on all pages loaded irrespective of the ?color= parameter in the actual URL.

I am lead to believe this is the best choice because the content on the page per colour is almost identical, violating the golden no duplicate content rule for Google. At most I could have the page title, header and description include the colour to make some difference in content, however all the rest of the text would be identical. Further I would also not wish to write completely different content (description) per colour as switching between colours could be a confusing experience for customers.

I have heard that if your product's colour is very important and ranks very highly per colour then it might be an idea to split the canonical to include the colour in the URL links. I do not believe this is a strong enough argument in this use case (but feel free to comment).

og:url

This leads me onto the open graph og:url link. As this link is mainly used to pull and display content for posts on social media channels I think the og:url parameter should include the colour, otherwise:


The image that is loaded into the social post would often show the wrong colour product (if the colour being linked was not the default colour) and therefore cause friction for the poster. This is the main sticker for me.
The customer will come to the page showing the wrong colour (quite easy to change it with the drop down though).
The product:color or product:ean tags cannot be used.


The main issues against using different URLs are:


Using different og:url links per colour dilutes "likes" by grouping to just the colour instead of the product a whole. This is not necessarily a bad thing if the colour is a main driver. The main question is how important is the number of likes a post has in terms of display reach on Facebook / other platforms? This argument is very similar to the Google canonical argument but as there is no downside due to duplicate content down ranking I think it seems sensible to go the other way on this.
Facebook display a warning when using the Facebook Sharing Debugger stating that the rel="canonical" and og:url links differ when testing a page. I am unaware if any penalty is applied due to this? Do any other platforms using the open graph get upset about this and penalise?


So there you have it. Pros and cons for each method. I have come to the conclusion the having the same rel="canonical" for all colours is best and to have separate colour specific urls for og:url links.

While this case is specific to me I think it applies to large amount of product pages on the web and as such advice on the pros and cons would be greatly appreciated. So if you have any more points to throw into the ring I'm sure many people would be glad to hear them.

Other solutions:


Include images for all the product colours with multiple og:image tags. This is one option however Facebook's docs state that multiple images should be used to offer alternate resolutions (no mention for different images). The official Open Graph page seems to be ambiguous on this point. I reluctant to go against protocol specs in this case.
Using product product.group "og:type" from the Open Graph spec. This would mean I would need further pages for the products also the product.group does not allow prices e.t.c so I believe it is better suited to category pages.
Use product.item "og:type" from the Open Graph spec. Same problems but cannot see any disadvantages to using this over just product tag except that it may not be as well adopted by new social platforms. It has the advantage of adding a link to a product group page, which in this situation could be a category say of the collection the product belongs to. (Maybe this is for a separate post).

Vote Up Vote Down

Login to post a comment!