Using HTML5's Microdata

Question

Where do I add the Microdata for a product on my site?

Do I add it on the actual page such as www.mysite.com/product/samsung-58-inch-tv.html, or do I add it to the aggregated listings for products? Such as www.mysite.com/products/tvs.html - or do I add it to both?

The aggregated listings contain a list of all the TV's the website sells.

Answer 1

It won't be seen as "spammy".
Google, Bing and Yahoo have all agreed to use the microdata format which exists at http://Schema.org

Any item/band/song/event/comment/rating/review/et cetera, which can be marked up cleanly and neatly ought to be.
And it should be done in any place where there is enough data for a consumer to be able to tell that the "Thing" is the same "Thing" that might be the subject of a review, or might have its own page, or might have an item-page on a shop, but might also have a product-page on the manufacturer's website...

There are schemas for ALL KINDS of these things.
But you have to do some reading, and you'll probably have to get into a couple of tutorials, prior to hopping in, full-tilt.

As an example, I have a band.
If people want to look at an event-feed/event-widget, I would mark up each concert as its own MusicEvent.
If people want to click into the page dedicated to that music-event and see the full-page press-release, or whatever, I would mark up that data as the same event (making sure that all of my info was spelled consistently, and delineated consistently, et cetera).

<section id="concert-listings">
    <!-- here's where all of our concert-listings go -->
    <article itemscope itemtype="http://schema.org/MusicEvent" class="concert">
        <h1 itemprop="name">
            <a itemprop="url" href="//nerdswithguitars.ca/events/2013-04-01/nwg_at_rancho">
                Nerds with Guitars@Rancho Relaxo w/ Rorry Taillon &amp; the Old Souls
            </a>
        </h1>
        <dl class="specs">
            <dt>when:</dt>
            <dd>April 1st, 2013
                <meta itemprop="startDate" content="2013-04-01T21:30:00">
                <meta itemprop="endDate"   content="2013-04-02T00:30:00">
            </dd>
            <dd>doors at 8:30 - music starts at 9:30</dd>
            <dt>where:</dt>
            <dd itemscope itemtype="http://schema.org/EventVenue">
                <article>
                    <h1 itemprop="name">
                        <a itemprop="url" href="//ranchorelaxo.biz/rancho_live.html">
                            Rancho Relaxo
                        </a>
                    </h1>
                    <ul itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
                        <li itemprop="streetAddress">300 College St</li>
                        <li>
                            <span itemprop="addressLocality">Toronto</span>,
                            <span itemprop="addressRegion">Ontario</span>
                        </li>
                        <li itemprop="postalCode">M5T 1R9</li>
                    </ul>
                </article>
            </dd>
        </dl>
        <section class="details" itemprop="details">
            <p>Join
                <span itemprop="performer" itemscope itemtype="http://schema.org/MusicGroup">
                    <a itemprop="url" href="//nerdswithguitars.ca">
                        <span itemprop="name">Nerds with Guitars</span>
                    </a>
                </span> and 
                <span itemprop="performer" itemscope itemtype="http://schema.org/MusicGroup">
                    <a itemprop="url" href="//rorytaillon.com">
                        <span itemprop="name">Rory Taillon &amp; the Old Souls</span>
                    </a>
                </span> as they...  ....  ....</p>
            <p>...</p>
        </section>
    </article>
    <!--  .........  -->
</section>

There's a lot there, especially considering that's only one single (fake) event, and it's only a blurb with the need-to-know stuff.
The ticket info isn't even included here (but microdata has that covered, too).

If you look closely, you'll see that an event has properties (a name, a website/page, start and end times)... ...but then some of its properties can have properties.
A concert happens at a venue.
But a venue has a name and a url and an address.
An address has a street, a locale, a region, a country, a postal-code...

Concerts also have performers...
Performers might be soloists or bands...
But each might have a name, might have a site, will have members -- each member might have their own personal site, and name and age and residence (with its own address), and phone-number and day-job at an organization which has its own........
...on and on and on.

You can nest this stuff into eternity.
Don't.

Mark the stuff that you would like Google to find, and understand, and link back.
For example, if I feed Google enough events featuring Nerds with Guitars, and when I do, I tie the event back to the band Nerds with Guitars, and then I tie the band-name back to the NwG website, and I tie authorship of the NwG site/content to the Google+ accounts of the members of the band, then all of a sudden, searches for the music might trigger event-listings, and might trigger user-profiles to show up in search, and the band's site might show up in searches for well-known events that the band is playing, et cetera.

That's not spam.
That's all relevant and interconnected and unique content.
Google eats that stuff up.

The key difference here is that Google is now taking qualified metadata (instead of the old meta keywords crap), and tying it all together.
It's also not taking it as-is. It's doing validation on formats (to make sure that machine-readable things, like dates and durations ARE machine-readable), and also doing cross-references on data it already has about a thing.

If there are 800 events/videos/songs/t-shirts/etc which say that Nerds with Guitars is at "//nerdswithguitars.ca/", and <link rel="author"> on the page points at a G+ profile, and some leet-haxx0r now tries to define Nerds with Guitars url as "//uberhaxxed.ru/viagra-sales", chances are very, very, VERY good that Google is going to use the old data, rather than including that data in search-results.

This is not a perfect technology, but basically, the more data gets shared, the more information Google has to work with, in terms of intelligently doing its "Big-Data" black-magic (which is pretty cool) on your stuff.

Hope that helps.

One other thing that Google doesn't really do an awesome job of telling you, on http://Schema.org, or in tutorials on the http://webmasters.google.com site (at least from what I've seen in the microdata FAQs):

An itemprop can be an itemtype, or can just be a URL/string...
It can also be BOTH an itemprop for the parent item (concert) and the itemtype wrapper (itemscope) for another item (band), at the same time.
If you were to leave an address as an itemprop, but fill the address out in a <ul itemprop="address">, Google would take all of the text inside of that <ul> and try to use it as the address.

You can have <a itemprop="url" href="..."> wrapped AROUND another itemprop (or even wrapped around a WHOLE sub-item, if you wanted).

<a itemprop="url" href="..."><span itemprop="name">Bob</span></a>

Also, if there's data that you really want to get in there, but doesn't make sense to put in, where it's human-readable: if you don't want to have 2013-04-01T21:30 as your actual date, for example, you can use <meta itemprop="startDate" content="2013-04-01T21:30">.
Alternatively, for time/date properties, specifically, you can use <time datetime="..."> and Google will intelligently pull the info out of there, much as it is smart enough to pull the url out of <a href="..."> or <link href="...">, or <img src="..."> if you make them itemprops.

This isn't for stuffing entries with keywords, but rather for bridging gaps where it really just doesn't make sense to put something in plain sight, because people already have the context, but the machine doesn't.

An example: Nerds with Guitars is pretty much guaranteed to be on the bill at a Nerds with Guitars show. If you're on the homepage, looking at the widget, nobody needs to know that NwG is going to be there. Nor do they need a link back to the homepage, which they're already on.
People might like to know who else is on the bill, though. So those people should be mentioned and linked to.
In that case, you should still include meta information for the band, so that Google can link the event back.

Hope this helps a little.