Google Rolls Out Rich Snippets for Recipes

As promised, Google have now rolled out Rich Snippets support for recipes in the search results.

Anyone using Google to search for a recipe can now use the filter tool to show only recipe based results.

Google have been crawling and analysing microdata, RDFa and microformats for a while, however this is the first time they’ve given the user the ability to filter on these results.

So as an SEO, what are microformats and how can you use them?

Well, microformats are basically HTML tags which give the search engines context around keywords and content.  

Using these tags, you can tell the search engines more about the content on your page

Now that Google have SERPs dedicated to recipes, using microformats is your opportunity to improve ranking within these results.

So let’s start by having a look at some HTML code for an example recipe:

   1:    <div>

   2:      <h2>Recipe for Disaster</h2>

   3:      <img src="/images/disaster.jpg" />

   4:      By Scotia Systems<br>

   5:      Published 25th February 2011<br>

   6:      A recipe for disaster<br>

   7:      Prep time : 5 min<br>

   8:      Cook time : 20 min<br>

   9:      Calories per serving : 0<br>

  10:    <br>

  11:      Ingredients : <br>

  12:      2 tsp cement<br>

  13: 

  14:      Directions:<br>

  15:      1. Stir vigorously and leave to set<br>    

  16:  </div>

Now when Google crawls this, they’re able to analyse the content and extract keywords, but knowing what the keywords actually mean is incredibly difficult and would require a lot of processing.   You’d need to look at the context of the page in general along with surrounding keywords to make a guess.

Microformats lets you tell Google directly what each part of the recipe relates to.   

Let’s now look at the above code with Microformats applied:

   1:  <div>   

   2:      <span class="item"><h2>Recipe for Disaster</h2></span

   3:   

   4:      <img src="/images/disaster.jpg" class="photo"/>   

   5:      By <span class="author">Scotia Systems</span><br>   

   6:      Published <span class="published">25th February 2011    

   7:      <span class-"summary">A recipe for disaster</span><br   

   8:      Prep time : <span class="preptime">5 min</span><br>   

   9:      Cook time : <span class="cooktime">20 min</span><br>   

  10:      <span class="nutrition">

  11:      Calories per serving : <span class="calories">0</span  

  12:      </span>

  13:      <br>  

  14:      Ingredients : <br>  

  15:      <span class="ingredients">

  16:      <span class="amount">2 tsp</span> 

  17:      <span class="name">cement</span><br>  

  18:      </span>

  19:      

  20:      Directions:<br>  

  21:      <span class="instructions">

  22:      1. Stir vigorously and leave to set<br>      

  23:      </span>

  24:  </div>

Now as Google crawls and analyses this, they can instantly tell what the ingredients are, the how long it takes to prepare etc.    None of the additional information is visible to the end user, just the search crawler bot as you can see below:

Recipe for Disaster

There’s a good post over at Google’s Webmaster Central which goes into more details on the different microformat standards and how you can use them.

Google have also provided a “Rich Snippets Testing Tool” which you can use to see how your code will appear in the search results.