Tuesday, June 14, 2011

Google Rich Snippet


Hi,

In this I will be discussing about rich snippets, what they are and how can they be useful in SEO. One of my colleague was working on the same, and decided to share with me so I am posting it in. Rich snippets are simply few predefined attributes in HTML tags, which are treated in a special way by Google. Have a look at the following. This will make it simpler to understand what they are:



The above is screen shot from Google search results when I search by "yelp" keyword. In the above we see a star rating and total reviews received for that App. These information are not present in Google search results by default. To make this happen we need to use rich snippets. Rich snippets can be used to representing the following:

1. Reviews (as given above)
2. People
3. Product
4. Business
5. Recipe
6. Events

The rich snippets can be implemented in 3 ways:

1. Microdata
2. Microformat
3. RDF

Use(Code) & Explanation:


In this I will be discussing about, Microdata, as that is the approach that we took and worked for us. In my project the requirement was same as the example I have given above. I needed to show the ratings for various hospitals. Before implementing the rich snippet, my webpage which was to be indexed without snippet had various HTML showing the total ratings the hospital got, total reviews received etc.

Now in order to implement the rich snippets in my code, I hardly had to make any extra changes in the existing HTML structure. All I had to do is to add few extra attribute to the existing HTML tags. e.g.

Before rich snippet:

<h1>NAME OF THE HOSPITAL</h1>
.
.
.
<div>
      <p>
           <span>3.5</span><span>out of</span><span>5</span>
      </p>
</div>
<span>
        From 40 reviews
</span>

After implementing rich snippets:

<h1 itemprop="itemreviewed">NAME OF THE HOSPITAL</h1>
.
.
.
<div class="revhld">
      <p itemprop="rating" itemscope="" itemtype="http://data-vocabulary.org/Rating">
           <span itemprop="average">3.5</span><span>out of</span><span itemprop="best">5</span>
      </p>
</div>
<span class="revtetxt">
        From <span itemprop="count">40</span> reviews
</span>



So this is pretty simple. You just need to put the right attributes in the right tags. You also need to take care of the hierarchy of the tags and attributes. e.g. in


<span class="revtetxt">
        From <span itemprop="count">40</span> reviews
</span>

First we have the class "revtetxt" inside it is <span itemprop="count">40</span>. Such conventions needs to be followed as given above. 

Once you are done implementing the rich snippet, Google provides a testing tool to check whether the rich snippet is successfully configured. This is important, as your web page may not get indexed immediately. But using this tool you will come to know, whether you did that correctly or not.

For more reference click here.

No comments:

Post a Comment