Google & Microformats: Drive More Traffic

Anyone that has spent time trying to improve their click through rates (CTR) from search engine results pages (SERPs) will tell you that Google algorithmically picks the snippet displayed for a given page; it’s not something you can always control. Unfortunately, Google doesn’t always display the snippet that will give you the best conversion rate.

However, the use of microformats, a set of agreed upon HTML conventions used to describe content, can give you more control of the snippets displayed in Google SERPs. Once your site is properly using rich snippets, you will see them also appear in your Google custom search and Google site search results, so this technique is definitely worth exploring if you use those tools as well.

The changes are easy to implement for WordPress, Magento and other software, let’s take a look at some use cases based on hReview, hCard, hProduct and XFN:

Businesses & Organizations

Property Description
name (fn/org) The name of the business. If you use microformats, you should use both fn and org, and ensure that these have the same value.
url Link to a web page on the business’s site.
address (adr) The location of the business. Can contain the sub properties street address, locality, region, postal-code, and country-name.
tel The telephone number of the business or organization.
geo Specifies the geographical coordinates of the location. Includes two elements: latitude and longitude. Optional.

Could be marked up as follows:

<div class="vcard">
   <span class="fn org">L'Amourita Pizza</span> 
   Located at 
     <div class="adr"> 
        <span class="street-address">123 Main St</span>, 
        <span class="locality">Albuquerque</span>, 
        <span class="region">NM</span>.
     </div>   
     <span class="geo">
        <span class="latitude">
           <span class="value-title" title="37.774929"></span>
        </span>
        <span class="longitude">
           <span class="value-title" title="-122.419416"></span>
        </span>
     </span>
   Phone: <span class="tel">206-555-1234</span>
   <a href="http://pizza.example.com/" class="url">http://pizza.example.com</a> 
</div>

Learn more about the business and organization markup at webmaster central.

Products

Property Description
brand The brand of the product for example, ACME.
category The product category for example, “Books—Fiction”, “Heavy Objects”, or “Cars”.
description Product description
name (fn) Product name
price Floating point number. Can use currency format.
photo URL of product photo
url URL of product page

Could be marked up as follows:

<div class="hproduct">
   Brand: <span class="brand">ACME</span>
   <span class="category">Heavy objects</span>
   <h1 class="fn">Large all-purpose anvil</h1>
   On sale for 
   <span class="price">$99.95</span>.
   <span class="description">If you need an object to drop from a height,
   the classic A23859 anvil from ACME is the way to go.</span>
   <a href="http://anvil.example.com" class="url">Anvil details page</a>
</div>

Becomes:

Individual Product

Learn more about the product markup at webmaster central.

People

Property Description
name (fn) Name
nickname Nickname
photo An image link
title The person’s title (for example, Financial Manager)
role The person’s role (for example, Accountant)
url Link to a web page, such as the person’s home page
affiliation (org) The name of an organization with which the person is associated (for example, an employer). If fn and org have the exact same value, Google will interpret the information as referring to a business or organization, not a person.
friend Identifies a social relationship between the person described and another person.
contact Identifies a social relationship between the person described and another person.
acquaintance Identifies a social relationship between the person described and another person.
address (adr) The location of the person. Can have the sub properties street address, city, region, postal-code, and country-name.

Could be marked up as:

<div class="vcard">
   My name is
   <span class="fn">Bob Smith</span>,
   but people call me
   <span class="nickname">Smithy</span>.
   Here is my home page:
   <a href="http://www.example.com" class="url">www.example.com</a>.
   I live in
   <span class="adr">
      <span class="locality">Albuquerque</span>,
      <span class="region">NM</span>
   </span>
   and work as an
   <span class="title">engineer</span> at
   <span class="org">ACME Corp</span>.
   My friends:
   <a href="http://darryl-blog.example.com" rel="friend">Darryl</a>,
   <a href="http://edna-blog.example.com" rel="friend">Edna</a>
</div>

Becomes:

People

Learn more about markup for people at webmaster central.

Reviews

Property Description
itemreviewed (item) The item being reviewed. In microformats, can contain the element name (fn).
rating A numerical quality rating for the item (for example, 4). You can indicate a rating scale by specifying best (default: 5) and worst (default: 1). More information about review ratings.
reviewer The author of the review.
dtreviewed The date that the item was reviewed in ISO date format.
description The body of the review.
summary A short summary of the review.

Could be marked up as:

<div class="hreview">
   <span class="item">
      <span class="fn">L’Amourita Pizza</span>
   </span>
   Reviewed by <span class="reviewer">Ulysses Grant</span> on
   <span class="dtreviewed">
      Jan 6<span class="value-title" title="2009-01-06"></span>
   </span>.
   <span class="summary">Delicious, tasty pizza on Eastlake!</span>
   <span class="description">L'Amourita serves up traditional wood-fired   
   Neapolitan-style pizza, brought to your table promptly and without fuss. 
   An ideal neighborhood pizza joint.</span>
   Rating: 
   <span class="rating">4.5</span>
</div>

Learn more about markup for reviews at webmaster central.

Interested in getting started? Well there’s no reason not to start using microformats as much as possible already; semantic markup is always good for search engine optimization:

  1. Update your markup (make sure it’s valid) and use the Quix bookmarklet to check your page, by entering ‘snippet’ to submit the current page to Google Rich Snippets test tool.
  2. Getting the “Insufficient data to generate the preview” error? Then make sure that there are no errors in the markup (go back to step one) or check that you are using enough data to generate the snippet preview, so check the microformat syntax again.
  3. Finally, let Google know that you’re an early adopter.

So who’s using microformats in this and other ways? Brands like Mashable, Yahoo!, Yelp, Technorati, SearchMonkey, LinkedIn, Urbanspoon and many more. If you’re interested in digging deeper into the future of microformats as they relate to web analytics as well, Dennis Mortensen from Yahoo! has a great post on what the future may hold.

Tags: , ,


Yoast.com runs on the Genesis Framework

Genesis theme frameworkThe Genesis Framework empowers you to quickly and easily build incredible websites with WordPress. Whether you're a novice or advanced developer, Genesis provides you with the secure and search-engine-optimized foundation that takes WordPress to places you never thought it could go.

Read our Genesis review or get Genesis now!

78 Responses

  1. Marty MartinBy Marty Martin on 18 February, 2010

    I use microformats all the time. Wondering who will win out though…Microformats v. RDFa ?

    • Frederick TownesBy Frederick Townes on 18 February, 2010

      I personally hope it’s microformats that win, that’s why I didn’t cover RDFa here. :)

    • RamoonusBy Ramoonus on 20 February, 2010

      Correct me if im wrong
      but RDFa is going to be built into html 5

  2. toddBy todd on 18 February, 2010

    nice tips, i’ll have to get the BSA contact page spiffied up with a nice vcard

  3. CharlesBy Charles on 18 February, 2010

    It is a good information. I will use in future developments.

  4. ariaBy aria on 19 February, 2010

    thanks for sharing. it’s very useful information

  5. JamesBy James on 19 February, 2010

    how do i go about adding microformats to a wordpress blog? I’ve searched everywhere but can’t find any recent plugins or info on it

    • Frederick TownesBy Frederick Townes on 19 February, 2010

      This requires editing your templates directly. Unfortunately there aren’t plugins that would effectively modify your markup to achieve these results. So from that perspective experience with themes is required.

  6. JamesBy James on 19 February, 2010

    appreciate the fast reply… I’ll keep looking into it

  7. PelegrinBy Pelegrin on 20 February, 2010

    google forever ;)

  8. LuciBy Luci on 22 February, 2010

    Thanks for this post, it’s brilliant. I;ve been looking into things a bit like this just lately and your post sums it all nicely with a great explanation and great links for further information.

  9. Ed CooperBy Ed Cooper on 22 February, 2010

    A great post. Thanks for the info Frederick!

  10. TerenceBy Terence on 22 February, 2010

    Obviously, this is something that SEO Ultimate, All-In-One-SEO, Platinum SEO etc should already be doing. I can only hope someone on their dev teams has Google Alerts switched on for their product names, gets this ping, and takes the idea on board. When its your own blog, digging-in and spending the time it takes to get it right, is more a labor of love and you’ll give it the time. But the average SEO client is probably not going to pay you to go into this much detail and will expect (and I think he would be well justified in thinking so), that WordPress and Magento would do this right out of the box, or there would be an after-market tool or plug-in that would do this automagically. But who knows, maybe Chris Pearson will even have it built into Thesis v2. We’ll see.

    • Frederick TownesBy Frederick Townes on 22 February, 2010

      I think this would fall in the lap of theme developers as opposed to plugin developers. Whoever does implement them will definitely have a significant value add over the competition.

    • John LamanskyBy John Lamansky on 27 February, 2010

      Thanks for the suggestion, Terence. I’ll add this to the feature ideas list.

      - John Lamansky
      SEO Ultimate developer

      • TerenceBy Terence on 27 February, 2010

        You are most welcome.

        I think its a race between you and Chris Pearson now. And as much as I love SEO Ultimate for some of my sites, and will continue to use it, if Chris puts it into Thesis v2, that would be just perfect for me. Then I could control the SERPs presentation of all kinds of sites without having to start coding.

        Heaven!

  11. eyuzwaBy eyuzwa on 22 February, 2010

    some great tips! I’ll check out my site content and see if I can incorporate these ideas.

  12. TonyBy Tony on 22 February, 2010

    I wasn’t aware of the term “microformats” before, but I am now, and will be looking to see how I can put this into practice. Very useful article indeed.

  13. William LangBy William Lang on 22 February, 2010

    It is my understanding that Google hasn’t yet fully implemented this feature for products. I believe they “receognize” the tags, but aren’t yet displaying the info properly for product data. Can anyone clarify this?

    • Frederick TownesBy Frederick Townes on 22 February, 2010

      As far as I know this is supported only in the normal search engine result page results. Clearly Google is using similar resources for their crawling, but in terms of what’s in play so far, that’s all we know.

  14. Jaan KanellisBy Jaan Kanellis on 22 February, 2010

    Absolutely no way microformats are going to help your CTR! The more content that Google uses in the SERP the less likely searchers will need to visit your site.

    • TerenceBy Terence on 22 February, 2010

      That seems on the face of it a rather convoluted turn of logic. Can you explain your thinking a little further so that I can understand you better?

    • Frederick TownesBy Frederick Townes on 22 February, 2010

      Jaan, the quantity of text in the snippets is not changing, only the editorial control.

      Just as with optimizing title tags, optimizing snippets definitely plays a role in click thru rates. In the past, Google exclusively controlled this so that they could optimize the CTR themselves (as that is their goal), however allowing publishers to do it helps google and helps publishers. I’m not sure where you find a disconnect.

  15. Bill Gram-ReeferBy Bill Gram-Reefer on 22 February, 2010

    It would be especially helpful if the next great event calendar plugin supported microformats wher the form for event data had microformat smarts

    • Frederick TownesBy Frederick Townes on 22 February, 2010

      Exactly! It’s my hope that the WordPress community recognize the opportunities here (and the benefits).

  16. Chuck BurnsBy Chuck Burns on 22 February, 2010

    Here is anothewr example of big brother Google knows best.
    I write a description and sometimes Google uses
    “This blog powered by WordPress’ as the description.
    If I want my description written a certain way then it is my site and should be my choice.
    That was a great idea thet Terrence made about adding this new element to All in One SEO and the other SEO plugins. I hope those guys are on this.
    Thanks Yoast and also thanks to the others who develope and give so much back to the WordPress platform.

    • Frederick TownesBy Frederick Townes on 22 February, 2010

      Are you using meta tag descriptions on pages that show ‘This blog powered by WordPress’ in search engine results? Usually Google knows better than to show that except in searches that are actually related.

  17. Josh FialkoffBy Josh Fialkoff on 22 February, 2010

    Hi Joost,

    You mention that this is easy to do in WordPress.

    How do you recommend implementing this in WP?

    Thanks,
    Josh

    • Frederick TownesBy Frederick Townes on 22 February, 2010

      For post pages in particular, the by line can easily be marked up using the reviews example. Some of the options in the microformats are optional you can use the test tool to determine if you’re providing enough information to Google. Meanwhile any CSS classes you were using to mark up those elements in your page (data, author name, title, etc) can be replaced with the class names shown in the microformat example.

  18. Dave DoolinBy Dave Doolin on 22 February, 2010

    Been wondering when semantic web was going to pop up.

    I’ve been working hRecipe plugin for WordPress for about 9 months. Very difficult to find time for development. A month of funding would really rock!

  19. Bill Gram-ReeferBy Bill Gram-Reefer on 22 February, 2010

    Frederick, does microformat even have “date” or separate “date” and “time” span classes?

    • Frederick TownesBy Frederick Townes on 23 February, 2010

      No, I’ve not seen those separated.

  20. Andrea MoroBy Andrea Moro on 22 February, 2010

    I think there are some problems with the images? Anyway, great post, despite personally I didn’t get any results … and I’m testing Microformat since the begin of this year, so it’s almost two months.

  21. Bill Gram-ReeferBy Bill Gram-Reefer on 22 February, 2010
  22. Glenn FriesenBy Glenn Friesen on 22 February, 2010

    Ditto Josh’s question above. Know any plugins for WordPress that’ll make this process super-easy?

    • Frederick TownesBy Frederick Townes on 23 February, 2010

      Not aware of any. I think asking theme developers for support of microformats is a good direction.

  23. Charlie EvansBy Charlie Evans on 23 February, 2010

    Great post thanks Frederick. I’ve been using the hCard for a while but this article is a good reminder to use all the available microformats, in particular hReview..

  24. Di DrinkwaterBy Di Drinkwater on 23 February, 2010

    But I want macro-formats to win!

    No, seriously what a spamy addition to the planet. It’ll be abused and then disused!
    I can’t see it not being used in an abusive way by spammers.

    • Frederick TownesBy Frederick Townes on 23 February, 2010

      Microformats can’t really be abused. That’s like saying there’s CSS or HTML spam. Microformats have been around for several years now and there’s nothing spammers can do that will give them any advantage playing with markup today compared to any point in the past. Nothing has changed except editorial control.

  25. Jeff MorrowBy Jeff Morrow on 23 February, 2010

    if RDFa is going to be built into html 5, why even consider microformats?

    • Keith from shrewdiesBy Keith from shrewdies on 25 February, 2010

      Jeff, I am far from an expert on this, but logic tells me that RDFa as part of HTML 5 is bound to become the standard over microformats. I’ve not done extensive research, but a little look at Adwords search data says that RDFa searches have come from nowhere to now being about two thirds of microformats.

      There are certainly more WordPress plugins supporting microformats at the moment, but once I’ve done my review of the 3 WordPress plugins for RDFa, perhaps more will join in :wink:

      • Frederick TownesBy Frederick Townes on 25 February, 2010

        Most publishers are not going to immediately upgrade their sites to HTML5. The other HTML standards will work fine in browsers and for the same reason, it will be easier for publishers to augment their CSS and HTML rather than learning new practices that achieve the same effect. And frankly that’s a good thing and why Google allows for both and also why I did not cover RDFa. :)

        • Keith from shrewdiesBy Keith from shrewdies on 25 February, 2010

          I absolutely agree with you, Frederick, but if, like me, you have only just been made aware of the importance of rich snippets (through your interesting article), would you not focus on RDFa, or is microformats in some way easier to implement?

          • Frederick TownesBy Frederick Townes on 25 February, 2010

            For those just finding out about it here, microformats, it is 100% easier to implement. As you can see many are looking for plugins already, but my hope was that those who do edit their themes and theme developers themselves would become more aware of the trend.

  26. felix adewoyeBy felix adewoye on 23 February, 2010

    great article, i have been looking at these for a while but wanted to see how they are playing out for everybody. One question though where should the code be placed on the page for the maximum benefit.

    • Frederick TownesBy Frederick Townes on 25 February, 2010

      I don’t think the location is too critical. Clearly since content flows top-down in the code, the use of microformats will follow naturally.

  27. Chris PetersonBy Chris Peterson on 24 February, 2010

    Great idea. You have explained clearly step by step. After reading your post I think no body will be confused.

  28. KuldeepBy Kuldeep on 25 February, 2010

    Does WordPress excrept can do the same thing with Meta description.

  29. JakeBy Jake on 25 February, 2010

    Great article, thanks.
    So we can use this for business, people, reviews, events, and even products…but what about services?
    Is there a property for services?

  30. gummibaerleBy gummibaerle on 26 February, 2010

    In your list you forgot the new rich snippets format for events: http://googlewebmastercentral.blogspot.com/2010/01/introducing-new-rich-snippets-format.html

    Greetings
    Wolfgang

  31. Become A BodyguardBy Become A Bodyguard on 26 February, 2010

    Very clearly explained once again. Many thanks for sharing. Another great idea :)

  32. Glenn KilpatrickBy Glenn Kilpatrick on 27 February, 2010

    I have heard of this before on the SEO forum I use. However I really Really Really dont understand Rich Snippets or what they are all about. Where is the special idiots guide for this subject ??

    • Frederick TownesBy Frederick Townes on 27 February, 2010

      This is it. :) What specific question do you have?

      • Glenn KilpatrickBy Glenn Kilpatrick on 27 February, 2010

        MMMMmmmmmmmmmmmm Sorry about this, it may be a long post, I am by my own admittance, perhaps not the sharpest tool in the box. To understand new things like this I need examples that are relevent to me.

        Have just had a re-read of your post, and some of the linked articles I am thinking that rich snippets is a method by which you can control the information that google displays in serps for a post on your site ?? Further to this I believe that you can only control the displayed information for either reviews or posts about people ?? It is not possible to use rich snippets for other posts, or is it

        So looking at my site. I have a review section of kayaks. I use Dan Grossmans review site plugin. People leave comments and a star rating for a particular kayak. An example of this is here : http://www.whitbyseaanglers.co.uk/scupper-pro-tw-angler-from-ocean-kayak I would like to know how I can use rich snippets to my advantage when displaying search results in google for this page and others like it.

        Like I say I am a complete dummy, but I am always willing to learn new tricks to help my site. I would like to thank your good self and yoast for your excellent work on this site. I believe you guys have really helped inprove my site for both me and my readers.

        Best regards – Glenn

  33. panikkarsonBy panikkarson on 28 February, 2010

    Good if I can have control of the snippet. For one of my sites, the snippet was quite relevant and
    gave a clear idea to the visitor of what to expect. For another one, it was a random sentence
    with no information when taken out of context.
    Shall try microfromats on all sites now.

  34. Jerry OkorieBy Jerry Okorie on 2 March, 2010

    Excellent piece. I always enjoy reading your blog with a cuppa. Does WordPress excrept can do the same thing with Meta description.

  35. SachaBy Sacha on 6 March, 2010

    Hello,

    I’m not sure to understand the “trick”…. How can I use this microformat tag in my template ? Can I do this for example ?

    Thanks :-)

  36. SachaBy Sacha on 6 March, 2010

    Sacha

  37. SachaBy Sacha on 6 March, 2010

    <blockquote cite="
    Sacha
    “>

  38. SachaBy Sacha on 6 March, 2010

    Sorry for spam, the code don’t display… So I post an image : http://yfrog.com/03microformatp

  39. ToddBy Todd on 17 March, 2010

    Interesting…We mostly use wordpress and would have to code it ourselves. It would be
    great if wordpress already came out of the box microformated. I would have to agree with
    Terence that SEO Ultimate, All-In-One-SEO, or Platinum SEO should have a plugin in developement. Perhaps they’re workin on it. Thanks for the insight!

    • TerenceBy Terence on 17 March, 2010

      I have to agree with Frederick in that, although there is obviously a big potential market for a plugin like SEO Ultimate or All-In-One-SEO that would truly transform the results in the SERPs when Google indexes your site, the template developers like Chris Pearson or Clay Griffiths, who already sell their templates at least partly, if not wholly, based on its ability to transform the SEO of your site, have the greatest amount of kudos to win and therefore, probably, will be the ones to rise to the challenge first. And it just so happens that both Chris and Clay are about to bring out new versions.

Trackbacks

  1. [...] Google & Microformats: Drive More Traffic – Yoast – If you haven't added microformats to your WordPress Theme, it's time to start as the day has finally arrived and Google is now paying attention to microformats. Yoast discusses the various microformats you should be using on your WordPress blog, and tells you why. [...]