Technical

We get pretty excited about code, so indulge us.

Here's a typical review:

  1. Pete Lounsbury Pete Lounsbury thinks…

    Founders Kentucky Breakfast One of the best beers I've had. It definitely demands respect. Pricey though, at $18 for 4. ★★★★★

    March 22, 2008 02:08 §
That gets turned into this code: 
<li class="hreview hentry">
  <span class="reviewer author vcard">
    <img src="http://img.tweetimag.es/i/petelbury_n" class="photo" alt="Pete Lounsbury">
    <a href="http://twitter.com/petelbury" class="url twitter-profile">Twitter Profile</a>
    <a href="/people/petelbury" class="fn url">Pete Lounsbury</a>
    
  </span>
 thinks… 
  <p>
    <span class="item">
      <a href="/reviewables/Founders+Kentucky+Breakfast" class="fn entry-title">Founders Kentucky Breakfast</a>    </span>
    <span class="summary entry-content">One of the best beers I've had. It definitely demands respect. Pricey though, at $18 for 4. <a href="/★★★★★" class="rating" title="5">★★★★★</a></span>
  </p>
  <span class="links">
    <a href="/reviews/47" class="timestamp" rel="self bookmark" title="Permenant link for this review">
      <abbr class="dtreviewed updated" title="2008-03-22 02:08:42">March 22, 2008 02:08</abbr>
    </a>
    <a href="http://twitter.com/petelbury/statuses/775226251" title="Original Twitter post">§</a>
  </span>
</li>

hReview

The spec is full of optional fields, so we get as many covered as we can: fn, summary, dtreviewed, permalink, & reviewer.

If the review has stars, we add in a rating, so they do more than just look pretty.

hCard

The reviewer is an hCard, and we get as much information as we can. Both the Twitter profile and the MicroRevie.ws profile use url. The Twitter real name is the fn and we use their photo

We could also put in their Twitter username as nickname and grab their website from Twitter as another url, but that would add more markup. Since Twitter has an hCard with this information, we'll count on the Social Graph API to make the connection.

Finally, on each user's profile page we add a link to their Twitter profile with rel="me". This is explicitly for the Social Graph API and will make their MicroRevie.ws profile another relationship.

hAtom

With a few more classes, we can turn our reviews into hAtom entries: entry-title, entry-content, updated, & author. The hReview's permalink gets reused for hAtom.

This lets us generate Atom feeds all over the site, from the homepage to each item's page to each user's reviews. Start subscribing!

Other

We try to use as little code as possible in the entire site, and we're coding in HTML 5.

In addition, there are other microformats sprinkled around the site. Happy hunting!