MICRODATA
=========

Overview
--------

Microdata allows you to layer lists of name-value pairs on top of Web
pages, so that JavaScript scripts, search engines, and other tools can
extract that data from the page directly, instead of you having to
provide it in a separate file, or them having to use screen scraping.

Note: The URLs used in this study are completely arbitrary and do not
really mean anything. Please don't be tempted to actually visit those
pages, that won't be helpful!


Data structures
---------------

The data structures that can be described using metadata are lists of
name-value pairs.

   Name: Value
   Foo: Bar

Each value can be one of several types: strings, URLs, datetimes, or
further nested lists of name-value pairs:

   Strings: Just some regular text
   URLs: http://example.com/
   Datetimes: 2009-04-01T14:23-08:00
   Lists of name-value pairs:
       Name: Value
       Foo: Bar

Each name can have multiple values:

   Color: Blue
   Color: Green
   Color: http://example.com/yellow


Syntax
------

To declare a list of name-value pairs in HTML, put the "itemscope"
attribute on an element:

   <div itemscope></div>

This makes the <div> element declare a list of name-value pairs,
though it is an empty list. The name-value pairs are then put inside
this element. It can be any element, not just <div>:

   <span itemscope></span>
   <p itemscope></p>

To declare a name in a name-value pair, you use the itemprop=""
attribute on elements inside the one with the itemscope="" attribute:

   itemprop="Name"

Declaring a value is done in various ways depending on what the value
is. For URLs, use <link>, <img>, or <a>:

   <link itemprop="Name" href="http://example.com/">
   <img itemprop="Name" src="http://example.com/">
   <a itemprop="Name" href="http://example.com/"> ... </a>

For datetimes, use <time>:

   <time itemprop="Name" datetime="1999-12-31T02:45-08:00"> ... </time>

For strings, you can either use <meta>:

   <meta itemprop="Name" content="String">

...or use any element other than the above, and put the value in the
contents:

   <span itemprop="Name">String</span>
   <p itemprop="Name">String</p>
   <div itemprop="Name">String</div>

For nested lists of name-value pairs, declare the nested list of
name-value pairs on the same element as you put the itemprop=""
attribute:

   <div itemprop="Name" itemscope>
     <!-- nested name-value pairs go here -->
   </div>


Examples
--------

This snippet:

   <div itemscope>
    <img itemprop="image" src="muse.jpeg" alt="">
    <span itemprop="title">The Muse in a Hat</span>
    <p>Published on: <time itemprop="pubdate" datetime="2009-12-31T00:00-08:00">December
    31st 2009, at midnight</time>.</p>
   </div>

...contains this list of name-value pairs:

   image: muse.jpeg
   title: The Muse in a Hat
   pubdate: 2009-12-31T00:00-08:00


This snippet:

   <div itemscope>
    <p itemprop="author" itemscope>
     <span itemprop="name">Fred Smith</span>
     (<span itemprop="age">28</span>)
    </p>
    <p itemprop="author" itemscope>
     <span itemprop="name">John Carey</span>
     (<span itemprop="age">35</span>)
    </p>
    <p itemprop="publisher" itemscope>
     <span itemprop="company">Sage Ojing Publishers</span>,
     <span itemprop="location">London</span>
    </p>
    ISBN: <span itemprop="isbn">0-123-123456789</span>
   </div>

...contains this list of name-value pairs:

   author:
     name: Fred Smith
     age: 28
   author:
     name: John Carey
     age: 35
   publisher:
     company: Sage Ojing Publishers
     location: London
   isbn: 0-123-123456789


Vocabularies
------------

There is an implied itemscope="" around the whole document, such that
the document has its own list of name-value pairs, and any element can
add to this list.

For example, the following document has three entries in its list of
name-value pairs, one of which is itself a list of name-value pairs:

   <!DOCTYPE HTML>
   <html>
    <head>
     <title>Example</title>
    </head>
    <body>
     <p itemprop="http://n.vii.org/work" itemscope>
      <img itemprop="itemid" src="cat.jpeg">
      <span itemprop="title">The Cat on the Mat</span>
      (License: <a itemprop="license"
      href="http://www.opensource.org/licenses/mit-license.php">MIT</a>)
     </p>
     <p>Tags:
      <a itemprop="http://technorati.com/tag" href="/tag/photo">Photo</a>,
      <a itemprop="http://technorati.com/tag" href="/tag/cats">Cats</a>
     </p>
    </body>
   </html>

Specifically, the three name-value entries in the list of name-value
pairs for the document are:

   http://n.vii.org/work:
     itemid: cat.jpeg
     title: The Cat on the Mat
     license: http://www.opensource.org/licenses/mit-license.php
   http://technorati.com/tag: /tag/photo
   http://technorati.com/tag: /tag/cats

The names, given in the itemprop="" attributes, are usually URLs. Each
such URL is defined to expect either a URL, a datetime, text, or a
nested list of name-value pairs as the value of the name-value
pair. Those that take a nested list of name-value pairs can define
short-hand names so that you can use those instead of URLs. This is
why, in the example above, the top-level names are all URLs
("http://n.vii.org/work", "http://technorati.com/tag"), but the
nested one can use short names ("itemid", "title", "license").


Predefined Vocabularies
-----------------------

For the purpose of this exercise, the following itemprop="" names are
defined. They are only allowed as names in name-value pairs that apply
to the whole document, and they must all have values that are lists of
name-value pairs, with the names given below them as possible names:

   http://example.com/animal (describes an animal species)
     image: A URL to an image of an animal of the species (URL)
     itemid: A URL that can be used to refer to the species (URL)

   http://n.vii.org/vEvent (describes a calendar event)
     summary: The name of the event (text)
     dtstart: The time of the start of the event (datetime)
     location: The location of the event (text)

   http://n.vii.org/vcard (describes a person or organisation)
     fn: The full name of the person (text)
     fn org: The full name of the organisation (text)
     adr: The address, itself as a nested list of name-value pairs
       with the following names given:
         street-address: The street address (text)
         locality: The city of the address (text)
         region: The state of the address (text)
         postal-code: The ZIP code of the address (text)
     tel: The telephone number (text)

   http://n.vii.org/work (describes a licensed work)
     itemid: A URL that can be used to refer to the work (URL)
     author: The name of the author (text)
     license: A URL to the license (URL)
     title: The title of the work (text)
     description: The description of the work (text)

   http://open-vocabulary.org/review (describes a product being reviewed)
     itemid: A URL that identifies the product (URL)
     name: The name of the product (text)
     price: The price of the product (text)
     price-range: The expected price range for the product (text)
     rating: The review's rating, a number from 0.0 to 5.0 (text)
     weight: The product's weight, with units (text)
     category: The URL to the relevant product category (URL)
     image: An image of the product (URL)
     contact: The person or organisation to contact regarding the
       product, as a nested list of name-value pairs using the same
       names and values described for "http://n.vii.org/vcard" above.
     kids: Whether kids are allowed (text)
     takeout: Whether takeout is available (text)
     outdoor-seating: Whether outdoor seating is available (text)
     attire: What kind of attire is needed to attend (text)
     parking: What kind of parking is available (text)

In addition, the following names can always be used as a name in any
list of name-value pairs, including the document-level list and all
the lists above (their names are unique URLs so there's no danger they
will clash with other names):

   http://wiki.tdwg.org/twiki/bin/view/DarwinCore/ScientificName
   The scientific name of the item being described (text)

   http://flickr.com/ns/camera
   The name of the camera used to take the picture, if applicable (text)

   http://flickr.com/ns/pubdate
   The datetime that the resource was obtained, if applicable (datetime)

   http://technorati.com/tag
   A tag that applies to the item being described (URL)


Indirect references
-------------------

Sometimes, the value part of a name-value pair is not inside the
element that has the item="" attribute. For example:

   <p itemprop="http://n.vii.org/vcard" itemscope>
    <span itemprop="fn">Fred Smith</span> is 28 years old.
   </p>
   <p>
    <span itemprop="http://n.vii.org/vcard" itemscope>Fred has a child
    named <span itemprop="fn">George Smith</span> who is 5 years old.</span>
    Fred's phone number is <span itemprop="tel">0181 811 8181</span>
    <!-- this is wrong: the phone number isn't part of the first item,
    it's at the document level! -->
   </p>

In this example, Fred's phone number in the second paragraph isn't
associated with Fred in the first paragraph, it's associated with the
document instead.

To get around this, the id="" attribute can be used to name the
element with itemscope="", and then the itemfor="" attribute can be
given with the itemprop="" attribute to associate them together:

   <p itemprop="http://n.vii.org/vcard" itemscope id="fred">
    <span itemprop="fn">Fred Smith</span> is 28 years old.
   </p>
   <p>
    <span itemprop="http://n.vii.org/vcard" itemscope>Fred has a child
    named <span itemprop="fn">George Smith</span> who is 5 years old.</span>
    Fred's phone number is <span itemfor="fred" itemprop="tel">0181 811 8181</span>
   </p>

The document's list of name-value pairs for this last example is the following:

   http://n.vii.org/vcard: 
     fn: Fred Smith
     tel: 0181 811 8181
   http://n.vii.org/vcard:
     fn: George Smith

------------------------------------------------------------------------
