How should I handle schema.org markup for a product with multiple sizes/prices

Question

While implementing schema.org markup for one of my cusomters online-shops I noticed a little difficulty. I think it's a missing option in the markup. Neighter offer nor aggregateOffer can handle this case correctly - although I think it is quite common.

• One page for one product (let's say it's a body-lotion)
• The body-lotion comes in 3 sizes, 100, 200 and 250ml
• It basically has an internal productId (BL100, BL200 and BL250) for each size as well as a EAN (http://en.wikipedia.org/wiki/International_Article_Number_(EAN)) for each size.
• How to buy: Go on the product page, chose your size, the price changes via javascript, click add to chart

Q: How can I markup ONE product with MULTIPLE sizes and MULTIPLE prices correctly?

Problems: http://schema.org/Product suggests only ONE productID which is wrong for me. If I add three offers (http://schema.org/Offer), search engines might think, the pricing is totally weird because the same product has three different offers.

http://schema.org/AggregateOffer doesn't seem right to me eighter.

Thanks for your help.

Answer 1

I think the correct way to mark up this particular scenario is by nesting several Offers inside of a single Product. To add additional information to each Offer, use an IndividualProduct. I'm not 100% sure, but this seems to work well in the Google Structured Data Testing Tool.

It looks like schema.org is still being updated with new ways to markup your products. The schema.org project pulled in a lot of structure from the Good Relations e-commerce product vocabulary. See E-commerce SEO Using Schema.org Just Got A Lot More Granular for more information about the new vocabulary items.

Say we want to list information about Sumatra coffee beans for sale on a website. We want to sell two different sizes (12 oz. and 16 oz.) with different prices for each. However, both product sizes should have the same images ('tis just a coffee bean) and name. The structure will look something like:

Product (name, description, and image)
  aggregateRating
  Offer (price and priceCurrency)
    IndividualProduct (sku and weight)
  Offer (price and priceCurrency)
    IndividualProduct (sku and weight)

Copy and paste the following into Google's Structured Data Testing Tool to see how Google will interpret the HTML.

jsFiddle display

<article class="product" itemscope itemtype="http://schema.org/Product">
  <div class="images">
    <a href="images/product.jpg">
      <img alt="Sumatra Coffee Beans" itemprop="image" src="images/product.jpg">
    </a>
  </div>
  <div class="content">
    <header>
      <h1 itemprop="name">Sumatra Coffee Beans</h1>
    </header>
    <div class="code">
      <span class="label">Item Number:</span>
      <span itemprop="productID">sumatra-coffee</span>
    </div>
    <div itemprop="description">
      <p>Error 418</p>
    </div>
    <div class="reviews" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
      <div class="details">
        Rated <span itemprop="ratingValue">4.5</span>/5
      </div>
      <div class="count">
        (<span itemprop="reviewCount">9</span> reviews)
      </div>
    </div>
    <div class="offer" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
      <div itemprop="itemOffered" itemscope itemtype="http://schema.org/IndividualProduct">
        <span class="sku" itemprop="sku">scb-ov1</span>
        – (<span itemprop="weight">12 oz.</span>)
      </div>
      <div class="price">$<span itemprop="price">14.99<span></div>
      <meta content="USD" itemprop="priceCurrency">
    </div>
    <div class="offer" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
      <div itemprop="itemOffered" itemscope itemtype="http://schema.org/IndividualProduct">
        <span class="sku" itemprop="sku">scb-ov2</span>
        – (<span itemprop="weight">16 oz.</span>)
      </div>
      <div class="price">$<span itemprop="price">20.99</span></div>
      <meta content="USD" itemprop="priceCurrency">
    </div>
  </div>
</article>