Structured Data on your website

Morning everybody,
Since we mentioned it yesterday while discussing content driven web design, let's talk about structured data.
So what is structured data? We first heard about it when were looping though all the menus in our Webmaster Tools. There was no structured data detected on our website and we were not really sure if it was a good thing or bad. But hey, since this is mentioned in Google Webmaster Tools, it is probably a good thing to have.
So we start googling what it is and how to implement it.
Pretty much structured data is a set of additional attributes and meta tags to describe your content.
You might think now, but we have already explained to search engines what is what, we have our title, we have meta description and keywords, we have our headings, we have awesome content, what else do you need?
Well, let's look again at our example, our website dedicated to best bars in the world. On our default page we want to display information about top rated bars. Each bar is defined as set of HTML tags and we display folloring information:

• bar image
• bar name
• address
• bar rating in our system (stars from 0 to 5)
• bar description

So let's say this is our HTML code:
<div class="bar">
    <div class="barimage">
        <img src="1111.jpg" alt="Bar 96 in Amsterdam" />
    </div>
    <h2>Bar 96</h2>
    <div class="rate">
        *****
    </div>
    <div class="address">
        Leidsestraat 1111, 1000AB, Amsterdam, Netherlands

    </div>
    <div class="description">
        Boutigue Bar 96 is located in the heart of Amsterdam. Here you can try the best

        cocktails, enjoy live music and lovely atmosphere.

    </div>
</div>

It does look like enough well formed information, doesn't it? Well with structured data you can actually tell search engines what exactly you are talking about, you can specify that this is information about a bar, this is a bar logotype, this is its' name, this is the address, this is the rate, and the description. In return your information would be formed differently in search results.
We don't want to copy all the information google already provided. So here are a few links for you so you can get a better idea why, how etc:
Rich snippets and structured data
Why Schema.org
Schema.org - getting started

 

So hopefully you had a look and now a bit more familiar with the subject.
Let's touch up our HTML to make it even more search engine friendly.
First thing we want to indicate that we are talking about bars, so let's alter parent div tag with following attributes:
itemscope itemtype=http://schema.org/BarOrPub

so now we have our div like this:
<div class="bar" itemscope itemtype="http://schema.org/BarOrPub">

next step, let's just go down the content. Our image - we want to specify that this is actually an image related to the bar we are talking about:
<img src="barpic.jpg" alt="Bar 96 in Amsterdam" itemprop="image" />

Bar name:
<h2 itemprop="name">Bar 96</h2>

Bar address:
<div class="address" itemprop="address"> Leidsestraat 1111, 1000AB, Amsterdam, Netherlands

</div>

 

Bar rate, here we go one level deeper. First we specify that this is the rate of the bar, and then we also want to specify rating value and best rating value to make it more clear how good the place is:

<div class="rate" itemprop="reviews" itemscope itemtype="http://schema.org/AggregateRating"> <meta itemprop="ratingValue" content="5" /> <meta itemprop="bestRating" content="5" /> *****

</div>

 

And finally bar description:

<div class="description" itemprop="description"> Boutigue Bar 96 is located in the heart of Amsterdam. Here you can try the best

cocktails, enjoy live music and lovely atmosphere.

</div>

 

So now how to test our HTML? Well thanks to Google, there is rich snippet testing tool. So open it up, switch to HTML tab, insert your HTML and click the button:

 

This is what we got in return:

 

So all the information we wanted to clarify is properly parsed and extracted. Not bad hey?

 

Check the list of all possible types, I am sure you will find all necessary properties for all your data.

 

Hope you found our little topic useful and clear. If you have any questions or comments, suggestions, please feel free to drop a line, we would really appreciate your feedback!

 

Cheers,
Your GPTeam