Structured Data – Schema.org Mark-Up & Microdata
Mark-up or microdata are code snippets that can be added to HTML pages that allow search engines to better understand what the webpage or components of the webpage are and what they pertain to. Applying this structured data to webpages can enhance the way in which webpages are listed in the SERPs (Search Engine Results Pages).
Consequently this can have an impact on CTR (Click Through Rates) and this in turn can affect the ranking of that webpage for its target keywords.
Schema.org provides a shared mark-up vocabulary that is accepted and readable by search engines. This article aims to provide you with example of Schema mark-up, instructions on how to implement it, and insights into the benefits of using.
For extensive and definitive information on Schema.org please follow the link.
Almost everything in this article is achievable through two methods, for the purpose of this article we will only be examining Schema.org code, but it is also possible to mark-up you webpages without code through Google Webmaster Tools.
For an explanation of how to mark-up your webpages without code please see our other article on Mark-Up with Webmaster Tools.
All microdata uses the same basic structure whether it is applied to video or events and as such we offer a basic explanation of these components here.
By adding itemscope to a div container you are identifying the HTML contained in the
<div>...</div> block pertains to a particular item:
It is not massively useful to state that there is an item being defined without specifying what type of item it is. For this, it is possible to specify the ‘type’ of item using the itemtype attribute immediately after the itemscope:
<div itemscope itemtype="http://schema.org/Movie">
In the example above we can see that the type of item that we are specifying is a ‘Movie’, this can vary to a range of item types detailed below. Using this example, everything contained within the DIV container is related to a movie/s.
Now that we have defined the scope and type of the content being marked-up, we need to define the properties of the item type. The available options for item properties depend upon the item type being defined, for example; a movie can have properties such as director, actors, name etc. whilst events will have properties such as location, date and name.
Continuing the example above, we could specify the genre of this movie with an ‘itemprop’:
Using a more complex example of specifying the director of a movie, there are several components to this. In this example the value of an itemprop can be another itemtype with its own properties:
<div itemprop="director" itemscope itemtype="http://schema.org/Person">
Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954)</span>
As you can see, under the property we have defined a new item type for a ‘person’. Then name and birthdate properties have been specified. In order to state that the value of an item property is in fact another item altogether, you begin a new itemscope immediately after the itemprop.
These three components define the structure and hierarchy for Schema.org microdata.