For each type of site content, be it events, reviews and the like, there are a number of different markup languages you could use: Microformats, Microdata or RDFa. Along with Google’s recent confirmation that they’re now using structured data gleaned from web page mark-up for shopping sites, comes the announcement of support for GoodRelations and their very own Product Vocabulary.
Let’s take a look at what’s available if you’re marketing product content online.
Microformats: hProduct with nested hReview
My personal preference for structured data has been Microformats for some long time. Why? I like the priciple that elemental Microformats are interchangeable and are often inspired by standards elewhere on the web. They’re simple, easy to understand and easy to implement. Some months ago, I covered testing strategies for Microformats implementation. In the example I used, you might have noticed I was combining (nesting) hProduct properties in the hReview. Here’s a snippet of the aggregate hReview with hProduct properties visible (you can do this the opposite way round, too – nesting hReview elements inside hProduct mark-up):
<div class="hreview-aggregate"> <span class="item"> <span class="fn">Green Bears</span> </span> <span class="hproduct"> <span class="fn">Green Bears</span></span> <span class="description">Buy all new green bears from SEOgadget Shopping! These green bears are tasty and delicious. Comes in packs of 6. </span> <span class="price">£9.95</span> <span class="category">Rare Pets</span> <span class="photo">http://www.seogadget.com/microformats/images/greenbears.jpg</span> <span class="rating">Rating: <span class="average">5.0 out of <span class="best">5</span></span></span> based on <span class="count">5</span> reviews.</div>
With Microformats, be sure to use fn, photo, brand, description, category and review properties in your actual product page. A correctly marked up page might look a little like this:
With all this said, for larger online retailers, hProduct might not be the best solution. If you have more data available than simply price, description and a photo, read on.
Good Relations – RDFa based mark-up
Good Relations is an RDFa based mark-up using established, and self defined namespaces. You can create your own snippet code with their generator, which produces markup for entities such as companies (and their locations), shops and products and services. According to their site:
GoodRelations is a language that can be used to describe very precisely what your business is offering. Some people call GoodRelations a “data dictionary”, others prefer “schema” or “ontology”. The name, however, is not important. Important is that you can use GoodRelations to create a small data package that describes your products and their features and prices, your stores and opening hours, payment options and the like.
Here’s an example snippet (missing the namespace declarations):
<div typeof="gr:Offering" about="#offering"> <div rev="gr:offers" resource="#company"></div> <div property="rdfs:label" content="FroliCat BOLT" xml:lang="en"></div> <div property="rdfs:comment" content="The FroliCat Bolt is guaranteed to keep your kitty transfixed for hours..." xml:lang="en"></div> <div property="gr:hasEAN_UCC-13" content="8334" datatype="xsd:string"></div> <div rel="foaf:depiction" resource="http://www.prezzybox.com/pb/data/media/22995.jpg"></div> <div rel="gr:hasBusinessFunction" resource="http://purl.org/goodrelations/v1#Sell"></div> <div rel="gr:hasPriceSpecification"> <div typeof="gr:UnitPriceSpecification"> <div property="gr:hasCurrency" content="GBP" datatype="xsd:string"></div> <div property="gr:hasCurrencyValue" content="19.95" datatype="xsd:float"></div> <div property="gr:hasUnitOfMeasurement" content="C62" datatype="xsd:string"></div> </div> </div> <div rel="gr:acceptedPaymentMethods" resource="http://purl.org/goodrelations/v1#VISA"></div> <div rel="foaf:page" resource="http://www.prezzybox.com/products/index.aspx?pid=8334"></div> </div> </div>
Good Relations have put a lot of effort into catering for online retail, and their documentation is easily accessible and well worth a review. To help you learn more, they created a handly little presentation on Slideshare.
Google Product Vocabulary – good for price comparison
You’d expect that if Google were to create their own mark-up standard, they might base it a little more closely on their product feed specification. Seemingly, not. There’s a comparision table available on this page where you can directly compare the elements from Google Product, hProduct, Good Relations and the product feed.
Something I really like about Google’s own, Microdata driven vocabulary is the concept of “offer”, where price, currency, condition and availablity are amongst the elements available to deploy. It certainly seems powerful when you review their offer aggregate vocabulary. Offer aggregate allows you to aggregate prices for the same product, showing lowest and highest prices available and the number of offers on the page.
Take a look at the examples code snippets here.
Which format will win?
I really enjoy working with Microformats, but I suspect that for the long haul, Google’s Product Vocabulary might be a wise choice for review. hProduct just doesn’t offer the attributes covered by Google and Good Relations. If you have a large dynamic site, with a lot of data on-page with multiple price comparison pages, you’ll probably have an easier time marking up with the product vocabulary on offer from Google.