Help Google Understand Your Website with Microdata

Home > Websites > Help Google Understand Your Website with Microdata

Before your eyes glaze over because we used the word “Microdata”, hang in there just a bit longer to see how you can easily help Google (and other search engines) better understand your website.

Google Wants Relevant Sites (Really!)

Let’s start with the idea that Google really wants to present a searcher with relevant and useful search results. Yes, they may have ulterior motives, like selling advertising, but for now, that’s not the main point.

In order to understand your website, and be able to present the results to the searcher when they are relevant, the Googlebot “crawls” your website, and indexes the content (the words) so it will know what your website is about. The other search engines do something very similar.

What if you could help Google know what searches your site should show up for?

What if you could help Google be sure it understands your website (or specific pages) better, so it will more accurately catalog your site, and make it more likely your site would show up for the right searches? That would be awesome, right? Well, that’s what we’re going to look at today.

This isn’t new. Google, Microsoft and Yahoo have been working on it for quite some time, and in 2011 created a site called schema.org for just this purpose. You’ll want to visit that link after you finish reading the rest of this post. :^)

Search resultsLet’s work backwards from the end result. If you look at search results, you’ll see something like the image at right (click for larger view). Where does all that stuff come from?

If you’ve done nothing to your page, it comes from a variety of sources around the web – including directories, review sites, your site, etc. BUT, if you use metadata (or similar things), you may be able to shape it a bit – by providing information about your business, products, people, events, reviews, recipes or music. These are the types of microdata Google says it supports.

By using the proper format for information about these things (your business, people, products, events, reviews, recipes or music), and by putting (or having your webmaster put) the correct HTML tags around the data, you help Google (or Bing, or Yahoo!) to better understand your pages or your site, and to know when it is relevant when someone is searching.

How to Add Microdata to Your Site

If you use a Content Management System (like WordPress, Drupal, Joomla, etc.), it may be as easy as adding a plugin (look for one that complies with the schema.org system, since all the search engines support it), and then just filling in the appropriate information in the configuration section for the site or for specific pages.

What if you don’t use a CMS? Then you (or your webmaster) will need to add the information to the HTML of your pages. There are many different examples, and they all have slightly different requirements, so we’ll just look at a short version of one from the schema.org site – for a recipe.

Let’s say you have a recipe for gluten-free, flourless peanut butter cookies (Yes!). Here’s the plain recipe:

Flourless Peanut Butter
Chocolate Chip Cookies

A favorite peanut-butter cookie, and it’s gluten-free!

Prep time: 15 minutes
Cook time: 12 minutes
Yield: about 2 dozen

Ingredients:

  • 1 cup firmly packed brown sugar
  • 1 cup smooth peanut butter (chunky may be used if preferred)
  • 1 large egg
  • 1 teaspoon baking soda
  • 1/2 teaspoon vanilla extract
  • 1 cup milk chocolate chips (or morsels)
  1. Stir together first five ingredients in medium bowl, using wooden spoon. Stir in chocolate chips/morsels
  2. Drop cookie dough by rounded tablespoonfuls onto a parchment paper-lined baking sheet
  3. Bake at 350 F for 12 minutes or until puffed and golden (Cookies will be soft in the center). Cool on baking sheet 5 minutes, remove to wire rack.

Enjoy!

Using the tags from the schema.org example, we would set it up only slightly differently, but the search engines will see this as microdata, and it will help them know that it is a recipe. Naturally, we’ve exposed the special tags here so you can see them, but if you use them on your page, they will not bee seen by visitors.


<div itemscope itemtype="http://schema.org/Recipe">
<span itemprop="name">Flourless Peanut Butter
Chocolate Chip Cookies
</span>

<span itemprop="description">A favorite peanut-butter cookie, and it's gluten-free!</span>

Prep Time: <meta itemprop="prepTime" content="PT15M">15 minutes
Cook time: <meta itemprop="cookTime" content="PT12M">12 minutes
Yield: <span itemprop="recipeYield">about 2 dozen</span>

Ingredients:

  • <span itemprop="ingredients">1 cup firmly packed brown sugar</span>
  • <span itemprop="ingredients">1 cup smooth peanut butter (chunky may be used if preferred)</span>
  • <span itemprop="ingredients">1 large egg</span>
  • <span itemprop="ingredients">1 teaspoon baking soda</span>
  • <span itemprop="ingredients">1/2 teaspoon vanilla extract</span>
  • <span itemprop="ingredients">1 cup milk chocolate chips (or morsels)</span>

Instructions:
<span itemprop="recipeInstructions">

  1. Stir together first five ingredients in medium bowl, using wooden spoon. Stir in chocolate chips/morsels
  2. Drop cookie dough by rounded tablespoonfuls onto a parchment paper-lined baking sheet
  3. Bake at 350 F for 12 minutes or until puffed and golden (Cookies will be soft in the center). Cool on baking sheet 5 minutes, remove to wire rack.

</span>

</div>

Enjoy!

By the way, some “all-in-one” web hosting solutions don’t support microdata, and other features that the search engines have added in recent years. You might want to be sure yours does!

×