Rich Snippet MarkupDecember 2012

Contents

1. Introduction

2. How To Use Schema

3. Tools

4. Next Steps

experience relevance

Summary

This presentation explains what rich snippets are and how they can be used to improve search engine results and website click through rates.

experience relevance

What Are Rich Snippets?Rich snippets provide search engines with ‘context’.

They enable a website owner to highlight important or useful pieces of information to the search engines.

For example a ‘product’ schema type could be applied to a particular product on a website.

This enables the website to tell the search engine where the product description, product cost and product name can be found.

experience relevance

Rich Search ResultsThe below screenshot outlines two search engine results which have the ‘review’ schema type applied to their content.

Rating

Reviews

Description

experience relevance

Rich Search Results

Source of information for

the search engine result.

Search engine result for ‘movies Tuggerah’

experience relevance

HTML StructureBelow is a quick overview of how HTML code is structured.

HTML Element

HTML Property

Most HTML Elements have a start and an end

experience relevance

Using SchemaThere is a schema type for just about any piece of content including ‘people’, ‘books’, ‘recipes’ and much more. In the below example we’ll take a look at the ‘movie’ schema type.

Content before schema mark-up

Content after schema mark-up

experience relevance

Schema Properties

Properties from Movie

actor Person A cast member of the movie, TV series, season, or episode, or video.

actors Person A cast member of the movie, TV series, season, or episode, or video. (legacy spelling; see singular form, actor)

director Person The director of the movie, TV episode, or series.

duration Duration The duration of the item (movie, audio recording, event, etc.) in ISO 8601 date format.

musicBy MusicGroup orPersonThe composer of the movie or TV soundtrack.

producer Person The producer of the movie, TV series, season, or episode, or video.

productionCompany Organization The production company or studio that made the movie, TV series, season, or episode, or video.

trailer VideoObject The trailer of the movie or TV series, season, or episode.

Below is the property list for the ‘movie’ schema type.

*Not all properties have to be applied when defining an object.

experience relevance

Schema PropertiesThe ‘movie’ schema type also uses properties from ‘thing’

Properties from Thing

additionalType

URL An additional type for the item, typically used for adding more specific types from external vocabularies in microdata syntax. This is a relationship between something and a class that the thing is in. In RDFa syntax, it is better to use the native RDFa syntax - the 'typeof' attribute - for multiple types. Schema.org tools may have only weaker understanding of extra types, in particular those defined externally.

description Text A short description of the item.

image URL URL of an image of the item.

name Text The name of the item.

url URL URL of the item.

experience relevance

Using Schema PropertiesSchema properties can be applied to any HTML tag. Most commonly you would apply it to a <h1> - <h9>, <div>, <p>, or <span> tag.

In the example above schema properties have been applied to <div>, <h1>, <span> and <a> tags.

experience relevance

Defining A Schema TypeLike all mark-up you need to define where a schema starts and ends.

To start defining a schema type, you would place the following code within the page content.

<div itemscope itemtype=“http://schema.org/{schema type}>

The content that is going to be used for this schema type has been encased in a <div> element.

experience relevance

Defining A Schema TypeIn most cases you will need to apply multiple schema types to a dataset.

In the example above, we have defined a ‘movie’ schema type.

Within the ‘movie’ schema there is the ‘director’ property. Because the director is a person, you will also have to apply the ‘person’ schema type.

experience relevance

Defining Schema PropertiesOnce you have defined where your schema type begins and ends, it is time to apply ‘properties’.To achieve this, the ‘itemprop’ attribute is used.

In the example above the ‘name’ and the ‘genre’ has been tagged using the ‘itemprop’ attribute.

experience relevance

Schema Test Tool

http://www.google.com/webmasters/tools/richsnippets

Entering the above code through the Google rich snippet tool produces the below output.

When Google sees this now ‘structured data’ it can easily determine that the page content is a ‘movie’

Additionally, Google can easily see the movie name and other properties defined using schema mark-up.

experience relevance

Broken Schema

In this case, the ‘name’ item property has been incorrectly implemented.

The below screenshot shows what is displayed when there is invalid schema applied to a webpage.

experience relevance

Summary

By applying schema mark-up to webpages:• Search engines can easily understand your data.

• If content is well understood by search engines, they can display richer results for your website based on your mark-up.

• This in turn increases the click through rates.

THANK YOU!