Hostels, RDFa, and Microformats

[Hostels]

[Note: tech-oriented post -- read the non-tech version here]

Google just announced that they will begin to support Web technologies called RDFa and microformats:

• http://radar.oreilly.com/2009/05/goo...at-parsin.html
• http://radar.oreilly.com/2009/05/goo...ort-for-m.html

These new technologies are ways to add machine-readable information to Web pages. The information is invisible to human visitors, but search engines and other tools can read this information.

People have been using microformats for years, but they haven't been widely supported (chicken or egg problem). Yahoo has indexing microformats for over a year, but Google's announcement is going to push them even further into the mainstream.

An example of a microformat is a blog tag. The tags in HostelManagement.com's hostel tag cloud have microformat information attached to them. Even though they just look like regular links, they have information attached that tells machines they are category tags.



If you want to view microformats in your browser, download the Operator extension for Firefox.

Here is an example of the Operator extension viewing microformat tags on HostelManagement.com -- the tags are highlighted on the left, and the actions available are on the right.



A "tag" is just one kind of microformat. There are also microformats for addresses, reviews, events, and much more.

The only hostel booking engine that has been using microformats so far is Boo.com which uses the hCard microformat. If you have Operator installed you can view it by going to any hostel's page. Here's an example from the page for Traveller's House:

1. This is a list of people and companies on the page: Travellers House as well as each user who left a review.
2. These are the actions available with the Operator extension, for example, automatically export to my address book or look up on Google Maps.
3. The microformat information is invisible to human visitors. It looks like a regular webpage.

Here is a screenshot of importing the hostel into my address book:



To make this happen, Boo.com used the hCard microformat, as shown in this code snippet below:

<p class="adr"><span class="street-address">Rua Augusta, number 89, 1st floor</span>, <span class="locality">Lisbon</span></p>

Boo.com isn't the only site using microformats -- other sites have been using them too:

• Yelp.com
• Yahoo's Upcoming
• Yahoo Travel and Yahoo Local
• and many more

The easiest way you can use microformats in your hostel's website, besides having a blog or CMS that generates tags, is to use the hCard microformat which defines contact information like address and phone numbers.

If you know HTML, it's very easy. You just use regular HTML <div>s and <span>s with classes that define the different elements of the person or company, and their address. This is an example of how you could write a company with it's address in a way that search engines and other tools can read it.

In the example, the class "fn org url" indicates that it's a first name, organization, and a URL. Other classes define the sections of the text that are the street address, locality (city), region (state), and other information.

<div class="vcard">
  <a class="fn org url" href="http://www.commerce.net/">CommerceNet</a>
  <div class="adr">
    <span class="type">Work</span>:
    <div class="street-address">169 University Avenue</div>
    <span class="locality">Palo Alto</span>,  
    <abbr class="region" title="California">CA</abbr>  
    <span class="postal-code">94301</span>
    <div class="country-name">USA</div>
  </div>
  <div class="tel">
   <span class="type">Work</span> +1-650-289-4040
  </div>
  <div class="tel">
    <span class="type">Fax</span> +1-650-289-4041
  </div>
  <div>Email: 
   <span class="email">info@commerce.net</span>
  </div>
</div>

[NOTE: There is also an hCard creator.]

Once this code is embedded into your webpage, machines (including Google and Yahoo) can extract the information.

See also this list of other Firefox extensions for microformats

For Booking Engines

The next step for with microformats for booking engines (beyond hCard) is to use the hReview microformat. This makes reviews machine readable.

In the future when you search for reviews, search engines (and other tools/sites) will know what parts of webpages are reviews because they are marked up with microformats.

Technorati used to have a "technology preview" search engine that search hReviews, but it appears to be offline now. Here's the link in case it comes back online:
http://kitchen.technorati.com/


RDFa

RDFa takes it a little further. See this primer for info:
http://www.w3.org/TR/xhtml-rdfa-primer/

Here are some examples of where RDFa could be used:
http://www.w3.org/TR/xhtml-rdfa-scenarios/

The Future of SEO

RDFa is the future of SEO (and the Web in general). Now that Google is on board, I expect it will happen quickly.

[Hostels]

If anyone wants to add the hcard microformat to their hostel website, post your full address, URL, and phone number here and I'll convert it to a microformat that you can paste back into your website.

I'll add tutorials about it later, but I only have time for this quick intro post right now.

[Hostels]

There is a simpler explanation here:
Google's "Rich Snippets": The Future of Hostel (and Hotel) Reviews

[Hostels]

Originally Posted by Hostels

The next step for with microformats for booking engines (beyond hCard) is to use the hReview microformat. This makes reviews machine readable.

Update: Boo.com already has hreview microformats on their property reviews.

If you know HTML you can see it in the code on this example page:
http://www.boo.com/london/hotels/156522_aquarius_hotel