Use Rich Snippets to Enhance your Search Results

A white, rounded square logo with an abstract S-shaped design on a gradient blue and purple background.

Why Use Rich Snippets?

You can take advantage of rich snippets and help your website stand out in the search engine results page (SERP).

If you were searching on Google for a great recipe for Chicken Parmesan, which link would you be more likely to choose?

Search results showing links to Chicken Parmesan recipes by Tyler Florence and Martha Stewart from Food Network and Martha Stewart's website respectively. Each link has a brief description, ratings, and rich snippets to enhance your search results.

If you are like most people, you would choose the first option. The eye-catching picture, rating, reviews, and a preparation time grabs the user’s attention more than the second option. The first link is using microdata to show a “rich” snippet and the second link is showing a normal snippet.

By enhancing your snippet you can distinguish your website from the others. The microdata informs the search engines of extra information about your website and it is displayed in the snippet area. Most of the time this leads to an increase in your click-thru rate because your visitor already knows what to expect on the page.

Listed below are the types of rich snippets that Google supports:

Rich Snippet Recipe Example

To the average user, this looks like a normal web page.

Screenshot of a Chicken Parmesan recipe page featuring prep and cook times, ingredients list, and links to print or save the recipe. With 398 ratings averaging 4.2 stars, this page uses rich snippets to enhance your search results for easy access to top-rated recipes.

However, there is microdata embedded in the HTML code that is only detectable by search engines. The microdata does not affect the appearance of the actual webpage.

You can view the source code on this page and see the microdata for yourself.

For the purpose of this example, I removed any CSS markup from the code so you can focus on the microdata.

 <div itemtype="">
 <h1 itemprop="name">Chicken Parmesan</h1>
 <img itemprop="image" alt="Picture of Chicken Parmesan Recipe"
 parmesan_s4x3_med.jpg" width="160" height="120" />
 <dd><meta itemprop="totalTime" content="PT1H5M" />1 hr 5 min</dd>

The microdata allows the search engine to display the following in the rich snippet preview:

  • itemtype=”” informs the search engine what type of rich snippet this going to be, in this case it is a recipe
  • itemprop=”name” is used for the name of the recipe
  • itemprop=”image” is used for the thumbnail image of the recipe
  • itemprop=”totalTime” content=”PT1H5M” is used for the total time to prepare the recipe

Google requires three specific attributes in order for your recipe to show up as a rich snippet in the SERP.

  • name
  • image
  • totalTime

I encourage you to take a look at the full hierarchy of schemas. This link is provided by who is working to create standardized microdata code that is supported by all the major search engines.

Test your Code and See a Preview

Once you have added the microdata, you can test it to make sure you did it correctly. Google has provided us with a structured data testing tool that will allow you to preview what your web page will look like in the SERP.

Share This

Join the Sales and Marketing News, receive our last insights, tips and best practices.

Our 7 Guarantees

Keeping 2,000+ Clients Happy Since 2001.

You Will Love Your Design We design to please you and your clients
Same-Day Support 24-hour turnaround edits during business hours
Free Education We provide knowledge to help you expand
No Hidden Charges We quote flat-rate projects
Own Your Site No strings attached
We Create Results SEO, PPC, content + design = clients
We Make Life Easier One agency for web, branding and marketing