Difference between revisions of "product-examples"

From Microformats Wiki
product-examples
Jump to navigation Jump to search
m
Line 198: Line 198:
 
** Buy this Online (rel=product)
 
** Buy this Online (rel=product)
 
* Currency implementation
 
* Currency implementation
 +
 +
'''Mark-up:'''
 +
 +
<pre><nowiki>
 +
<div class="hproduct">
 +
<a href="#" rel="product"><img src="assets/images/timeline/amazon/small-faces.gif" alt="Small Faces Album" class="product-thumb" /></a>
 +
<h3 class="product-title"><a href="#" rel="product">Ogdens' Nut Gone Flakes</a></h3>
 +
<h4 class="p-v"><span class="property artist">Small Faces</span></h4>
 +
<p class="product-buy"><a href="#" title="Buy this online" rel="product">Buy from Amazon</a></p>
 +
<p class="money"><abbr class="currency" title="GBP">&pound;</abbr><span class="amount">6.99</span></p>
 +
</div>
 +
</nowiki></pre>
  
  
Line 231: Line 243:
 
* Features
 
* Features
 
* Included Accessories
 
* Included Accessories
 
 
<pre><nowiki>
 
<div class="hproduct">
 
<a href="#" rel="product"><img src="assets/images/timeline/amazon/small-faces.gif" alt="Small Faces Album" class="product-thumb" /></a>
 
<h3 class="product-title"><a href="#" rel="product">Ogdens' Nut Gone Flakes</a></h3>
 
<h4 class="p-v"><span class="property artist">Small Faces</span></h4>
 
<p class="product-buy"><a href="#" title="Buy this online" rel="product">Buy from Amazon</a></p>
 
<p class="money"><abbr class="currency" title="GBP">&pound;</abbr><span class="amount">6.99</span></p>
 
</div>
 
</nowiki></pre>
 
  
  

Revision as of 20:48, 1 February 2007

Product Examples

This is an exploratory page to document product examples currently published around the web. Typically, the metadata associated with this content is stored in non-semantic markup and proprietary formats. The purpose of the studies on this page is to serve as background for the design of a simple distributed product microformat.

Authors

  • Aaron Gustafson
  • Adam Craven
  • Craig Cook
  • Ronnos

Examples

Amazon

CD

  • buying - contains unstructured data
    • album (product name)
    • artist
  • prodImage
  • listprice
  • price (actual price and "you save")
  • productDetails - contains unstructured data
    • format
    • release date
    • # of discs
    • label
    • ASIN

Book

  • buying - contains unstructured data
    • title (product name)
    • format
    • author
  • prodImage
  • listprice
  • price (actual price and "you save")
  • productDetails - contains unstructured data
    • format
    • page count
    • publisher
    • publication date
    • language
    • ISBN
    • dimensions
    • weight

Video Game

  • buying - contains unstructured data
    • title (product name)
    • publisher
    • platform
  • prodImage
  • listprice
  • price (actual price and "you save")
  • bucket (game info)
    • ESRB Rating
    • genre
  • productDetails - contains unstructured data
    • ASIN
    • SKN
    • release date

Outdoor Product

  • buying - contains unstructured data
    • product name
    • brand
  • prodImage
  • listprice
  • price (actual price and "you save")
  • bucket (product features)
  • productDetails - contains unstructured data
    • dimensions
    • weight
    • ASIN
    • model number

Buy.com

CD

  • productTitle
  • artist (unstructured)
  • image (unstructured)
  • mainPricSection - contains unstructured data
    • actual price
    • shipping
    • total (augmented by quantity)
  • prodPriceSec_2 - actually product details
    • format
    • release date
    • label
    • SKU
    • item #
  • prodInfoSec_1 - additional details
    • description

Book

  • productTitle
  • author (unstructured)
  • image (unstructured)
  • mainPricSection - contains unstructured data
    • actual price
    • shipping
    • total (augmented by quantity)
  • prodPriceSec_2 - actually product details
    • format
    • ISBN
    • publication date
    • publisher
    • dimensions
    • SKU
    • item #
  • prodInfoSec_1 - additional details
    • description

Video Game

  • productTitle
  • image (unstructured)
  • mainPricSection - contains unstructured data
    • actual price
    • shipping
    • total (augmented by quantity)
  • prodPriceSec_2 - actually product details
    • format
    • release date
    • publisher
    • sku
  • prodInfoSec_1 - additional details
    • description

TV

  • productTitle
  • image (unstructured)
  • mainPricSection - contains unstructured data
    • list price (msrp)
    • you save
    • price
    • shipping
    • actual price
  • prodPriceSec_2 - actually product details
    • manufacturer (brand)
    • part #
    • SKU
    • item #
  • prodInfoSec_1 - additional details
    • description
  • prodInfoSec_2 - tech specs (unstructured)
    • type (product description summary)
    • display area
    • native resolution
    • contrast ratio
    • viewing angles
    • power
    • weight
    • warranty
    • etc.


Ben Sherman

Clothes

Link to product rather than actual product immediately available for sale. Personally marked-up and used rel-product ideas to link to the shop.

  • Image
    • Thumbnail
  • Product
    • Type
    • Title
  • Properties
    • Colour
  • Link
    • Buy this Online (rel=product)

Mark-up:

<div class="hproduct">
	<img src="#" alt="polo shirt" class="product-thumb" />
	<h3 class="product-type">Polo Shirt</h3>
	<h4 class="product-title">Coxmoor</h4>
	<p class="p-v"><span class="property">Colour:</span> <span class="value">289 Rush</span></p>
	<p><a href="poloshirt/coxmoor/" title="Buy This Online" rel="product">Buy This Online</a></p>
</div>

CDs

Additionally the site has links to products on Amazon.

  • Image
    • Thumbnail
  • Product
    • Title
  • Properties
    • Artist
  • Link
    • Buy this Online (rel=product)
  • Currency implementation

Mark-up:

<div class="hproduct">
	<a href="#" rel="product"><img src="assets/images/timeline/amazon/small-faces.gif" alt="Small Faces Album" class="product-thumb" /></a>
	<h3 class="product-title"><a href="#" rel="product">Ogdens' Nut Gone Flakes</a></h3>
	<h4 class="p-v"><span class="property artist">Small Faces</span></h4>
	<p class="product-buy"><a href="#" title="Buy this online" rel="product">Buy from Amazon</a></p>
	<p class="money"><abbr class="currency" title="GBP">£</abbr><span class="amount">6.99</span></p>
</div>


Atomic Books

Books

  • Image
    • Thumbnail
  • Product
    • Title (productname)
    • Author
    • Publisher
  • Properties
    • Page Count
    • Size
  • Notes
  • Date Published (can be in future to indicate "not yet released")


Walmart

Cell phone

  • Productname
  • Photo's (Photo)
    • Productimage (Pdi)
    • Thumbnails (PdiThumbs)
  • Price (PriceInfo)
    • Productprice (ProdPrice)
    • Shipping options (Ship)
    • Availability (Avail)
    • Pricing options (PriceOptions)
  • Description (Description)
  • Features
  • Included Accessories


The use of Non-visible property names made it possible to have an invisible property of 'artist'. Having 'Artist: Small Faces' was not in the visual specification of the Ben Sherman site.

See Also