Rich snippet data for Product pages

I’ve been doing a lot of research over the last few weeks trying to find the best method of inserting rich-snippet data in product category pages.

iphone-5-review-by-cnet-serp-snippet3-e1421312714385[1]

Goal of adding rich snippet data

The goal would be to help crawlers better understand the type of data being displayed so that the visibility of the page gets improved. Other goals include:

  1. Improve SERP rankings / visibility:
    1. Display Price from information
    2. Display reviews
    3. Improve breadcrumb information
    4. Improve the accuracy of shopping cart information
      1. Product name
      2. Price
      3. Description
      4. Product images
      5. Promotional information

How to add rich snippet product information

I am writing this blog post as I go along therefore the conclusions will be published at a later date. For now this is what I am planning / will do.

Inform search bots that the content inside this div is related relates to a particular product and use the below attributes as defined by Schema.org and recommended by Google.

Place the below information into the div where all the product information is contained in;

<div itemscope itemtype="//schema.org/Product">

From there you simply need to surround each peace of content with the attribute “itemprop”, example below:

<span itemprop="name">Product Name</span>

Below is a table containing attributes which you can use to define your product (sourced from Google Inc).

Product

Property Description
name The name of the product.
image The URL of a product photo.
description Product description.
brand The brand of the product. Can include nested organization info. Google recommends includingbrand and at least one identifier for each product.
category The product category—for example, “Books-Fiction“, “Tools“, or “Cars“. You can include multiple categories. Any value is accepted, but Google recognizes the categories described in this article.
review A nested Review-aggregate of the product (for example, the average rating). If there are multiple reviews of the product, mark up aggregated review data (for example, the average rating from all users) using Review-aggregate rather than individual reviews.
identifier The product identifier. Google recommends including brand and at least one identifier for each product.Recognized types include:

  • asin
  • isbn
  • mpn
  • sku
  • upc
offerDetails An offer to sell the product. Includes a nested Offer or Offer-aggregate.

You can read more about this at: //support.google.com/webmasters/answer/146750?hl=en#offer_properties

How to add rich snippet pricing information to product page

This is where it really gets tricky depending on your eCommerce solution.

Property Description
price The price of the product. A floating point number. You may use either a decimal point (‘.’) or a comma (‘,’) as a separator.
priceCurrency The currency used to describe the product price, in three-letter ISO format.
priceValidUntil The date (in ISO date format) after which the price will no longer be available. (Your product snippet may not display if the priceValidUntil property indicates a past date.)
seller The seller of the product. Can contain a Person or Organization.
condition Any text may be specified. If the condition attribute is used, the value of the content attribute must be one of the following recognized values:

  • new
  • used
  • refurbished

For example:

<span itemprop="condition" content="new">Brand new!</span>
availability Any text may be specified, but the value of the content attribute must be one of the following recognized values:

  • out_of_stock
  • in_stock
  • instore_only
  • preorder
quantity The number of items available for this offer.
offerURL A URL to the product web page (that includes the Offer). (Don’t use offerURL for markup that appears on the product page itself.)
identifier The product identifier. Google recommends including brand and at least one identifier for each product.Recognized types include:

  • asin
  • isbn
  • mpn
  • upc
  • sku
itemOffered The item being sold. Typically, this includes a nested Product, but it can also contain other item types or free text.

What is a breadcrumb and why is it important?

Breadcrumbs bring structure to your site, it also is a great tool to improving your internal linking structure so that search engines have a better understanding of what is more / less important to you. i.e. the more a page is internally linked to the more important it would be.

breadcrumbs-e1421314132407[1]

The second advantage of adding a breadcrumb is that it is visible and on the search engine results page, allowing users to click directly to sub-sections of your site and can also improve the CTR (click through rate) from search.

Below is an example of a breadcrumb taken from //schema.org/BreadcrumbList.

<ol itemscope itemtype=“//schema.org/BreadcrumbList”>

  <li itemprop=“itemListElement” itemscope

      itemtype=“//schema.org/ListItem”>

    <a itemprop=“item” href=“//example.com/dresses”>

    <span itemprop=“name”>Dresses</span></a>

    <meta itemprop=“position” content=“1” />

  </li>

<li itemprop=“itemListElement” itemscope

      itemtype=“//schema.org/ListItem”>

    <a itemprop=“item” href=“//example.com/dresses/real”>

    <span itemprop=“name”>Real Dresses</span></a>

    <meta itemprop=“position” content=“2” />

  </li>

</ol>