Schema made easy – The beginner’s guide

One recommendation that comes up time and again when exploring how to improve the search engine optimisation of a website is to add a structured data markup, sometimes referred to as ‘Schema markup’ or ‘structured data’.

For the uninitiated and even for some SEO professionals, structured data is still something of a mystery. What is it? What is Schema and how does it relate to structured data markup? What do webmasters need to do to implement a Schema markup?

We’ve put together a beginner’s guide to structured data and Schema made easy, as well as a handy cheat sheet for you to print off and use at your own convenience.

schema made easy

 

What is structured markup?

Essentially, structured markup is a way of helping search engines to understand the content of a website. Although elements of a web page make sense to human visitors, search engines can find them harder to decipher – this might include elements like reviews, recipes, ratings, events, and product descriptions.

Structured data goes into the HTML code for a web page and tells the search engines what each element on the page is about.

 

How does Schema markup help with context?

Structured data is also important because it tells search engines what your content means rather than what it says. In other words, it puts it in context. For example, if I put the right structured markup around my name ‘Hazel Jarrett’, I can tell the search engines that an article has been written by me rather than just mentioning me.

Equally, I can help the search engines to understand whether a website about Jaguars relates to the big cats or the cars, or if a review is about a book or the film of a book. As Schema.org explains it:

“Most webmasters are familiar with HTML tags on their pages. Usually, HTML tags tell the browser how to display the information included in the tag. For example, <h1>Avatar</h1> tells the browser to display the text string “Avatar” in a heading 1 format. However, the HTML tag doesn’t give any information about what that text string means — “Avatar” could refer to the hugely successful 3D movie, or it could refer to a type of profile picture—and this can make it more difficult for search engines to intelligently display relevant content to a user.”

 

How do search engines use structured data?

Search engines can then use this information to create rich snippets, which are the small ‘extra’ pieces of information that appear in search results.

To give an example, Hyde Park is famous for its summer events’ calendar. As might be expected, when I ran a search for events in Hyde Park I found that structured data has been used to highlight some forthcoming events through various ticket suppliers:

 

Events structured data

 

This will help give visitors a shortcut to the events they might be looking for, and to showcase the variety of events on Hyde Park’s events’ calendar, especially the most immediate.

Let’s look at another example. Imagine you want to find the best lasagne recipe for tonight’s dinner. You type ‘lasagne recipe’ into Google and see these three options near the top of page one:

 

Recipe structured data

 

Which would you choose? The top two entries have used structured markup to make sure that a picture is included in the search results. Tesco Real Food has gone one step further and added in star ratings, reviews and the number of calories per portion, giving lots of extra value before someone even clicks through to the page. Personally, I would click that listing to find out more – I bet you would too.

As we can see from these two examples alone, structured markup can and should be an important part of the SEO strategy for any website. Not only does it signpost content to the search engines, but it also helps searchers make a more informed decision about which listing to click on – this should help you improve your conversion rates. In turn, Google is looking to reward high value, customer-focused websites, so may prioritise your listing in SERPs.

Using structured data is a win/win situation.

According to a study by Searchmetrics:“We found that domains with schema integrations do in fact rank better by an average of 4 positions when compared to domains without them. By way of qualification, it should be noted that domains with integrated Schema tags may be generally better optimized than domains without.”

That being said, Searchmetrics found in the same study that only 0.3% of domains currently include Schema integration. This is a clear opportunity to stand out from the crowd – or even make your website visible before the crowd shows up – especially when we consider that Google returns information taken from Schema snippets for nearly 40% of keywords!

 

What is Schema?

Schema.org is a ‘Microdata’ vocabulary – in other words, a series of agreed-upon HTML tags devised by a community of experts that should help us all implement structured data more easily. It is officially supported by Google, Bing, Yahoo! and Yandex, and is now Google’s preferred method for structured data if you want rich snippets in your search results.

It’s worth noting that there are types of structured data other than Microdata, e.g. Microformats and RDFa.

If we take a piece of code from the example below, the words ‘itemscope’ and ‘itemtype’ tell websites that the code being used is Microdata, but the bit that says schema.org/Movie tells the search engines that we’ve taken this tag ‘Movie’ from the Schema vocabulary.

schema code

Schema is so popular because all of the search engines have agreed to recognise this vocabulary.

 

What does Schema markup look like?

In its start-up guide, Schema gives the following example to show a Schema markup in action:

Imagine you have a page about the movie Avatar—a page with a link to a movie trailer, information about the director, and so on. Your HTML code might look something like this:

 Schema code

 

To begin, identify the section of the page that is “about” the movie Avatar. To do this, add the itemscope element to the HTML tag that encloses information about the item, like this:

itemscope element

By adding itemscope, you are specifying that the HTML contained in the <div>…</div> block is about a particular item.

But it’s not all that helpful to specify that there is an item being discussed without specifying what kind of an item it is. You can specify the type of item using the itemtype attribute immediately after the itemscope

itemtype schema

This specifies that the item contained in the div is in fact a Movie, as defined in the schema.org type hierarchy. Item types are provided as URLs, in this case http://schema.org/Movie.
 

To give the search engines even more insight into what the elements on a web page are about, we can also label the properties of an item by applying the itemprop attribute. Again, here’s Schema’s Avatar example:

schema itemprop attribute

From the itemprop tags, we can see in this entry that Avatar is the name of the movie, James Cameron is the director, the genre is Science fiction, and that the URL links to a trailer of the film. You will notice that there are new <span>…</span> tags in the code (highlighted in yellow above) to attach the item properties to specific text on the page.

 

How do I know what itemtype or itemprop tag to use?

Schema has created a dictionary of item types and properties so, before you markup a page, I would recommend searching Schema for the right tag.

There are different levels of item types. For example, a ‘Thing’ is the broadest and most generic item type you can apply to an element of a web page. Within ‘Thing’, you will find more specific item types, such as: Action, Creative Work, Event, Intangible, Medical Entity, Organisation, Person, Place or Product. Again, within each of these item types, you will find more specific descriptions, such as Organisation>Local Business>Childcare.

Using the right item type can help you get your website listed in targeted searches, attracting website visitors who have a high level of interest in your products or services.

 

 

How can I apply a Schema markup to my website?

As we can see from the example above, to implement a Schema markup, it helps if you have some knowledge of HTML. Therefore, if you work with a web developer, they would be the person best placed to add structured data to the HTML code of your website. However, if you manage your own site, various tools are available to help you add structured data to your web pages. Schema.org also includes some helpful guides and information.

 

Schema for WordPress websites

If you have a WordPress website, there are some fantastic Schema markup plugins. The free All-in-One Schema.org Rich Snippets plugin lets you apply the main item type and item prop tags via a simple dropdown menu and easy-to-complete field. For example, after creating a new blog post for your website, you would simply select that the item type is an ‘article’ before being given the following form to complete:

Schema for WordPress websites

 

Alternatively, click the ‘Add Schema’ button above your article when you’re adding it to your WordPress site and you will be given even more detailed fields. With a recipe, for example, you can add calories, sodium, cooking times, prep times, ingredients, and much more; the same goes for other item types.

Paid-for plugins also exist – Schema.org mentions:

 

Schema for non-WordPress sites

If you don’t have a WordPress website, you might want to use Google’s Structured Data Markup Helper to help you with your Schema markup.

When you go into this tool, you will see the following screen:

Google’s Structured Data Markup Helper

 

Simply pick your item type from Articles, Films, Restaurants, etc. and then paste the URL of the relevant web page into the URL field and click ‘Start tagging’.

The tool will generate a view of the web page within the tagging screen. At this stage, you need to highlight the different elements you want to tag – one at a time – and click the most appropriate tag from the options given (see the options circled below):

highlight the different elements you want to tag

 

Once you have tagged all the elements on the page that you want to tag, click ‘Create HTML’ and the Structured Data Markup Helper will generate the modified HTML code for that web page. You then need to copy and paste the new code over the existing code for your site.

To check everything is working properly, you should then go to the Structured Data Testing Tool to see what tags Google can see.

Where this may be more challenging is if your website was built by an external web developer and you have limited access to the backend of your site via a customised content management system. In this case, it would be worth approaching the web developer about how you can apply a Schema markup. If you are about to have a website built, I would recommend discussing Schema markup from the outset to ensure that it is incorporated into your web content in the appropriate places.

 

Is there anything that you shouldn’t markup with Schema?

You don’t need to apply structured data markups to every element of your website – instead, think about what your potential customers might find it helpful to know about a specific web page before they decide to click through. What would influence them? What would add value? What would answer what they’re looking for?

By keeping your potential customers centre stage, you can create a Schema markup that attracts clickthroughs and makes sense to the major search engines.

Google advises that you only apply Schema markups to elements of the page that are visible to human visitors, rather the cloaking or hiding content and applying structured data to information visitors can’t see.

The contents of the Schema markup should also reflect what people will actually see if they go to the page. For example, don’t show star ratings or reviews in Schema if visitors won’t find them when they click through via Google.

Finally, Google won’t generate rich snippets for time sensitive pages, such as landing pages with an offer deadline, so don’t worry about Schema markup for those.

 

 

Resources

Want to know more about Schema markups and Schema.org? Check out the following guides and tools:

Guides

Tools

Schema cheat sheet

We’ve also put together a Schema cheat sheet to give you an at a glance guide to some of the most common Schema tags. Click here to download your copy.

 

Hopefully, I’ve helped to pull back the curtain on some of the mysteries surrounding Schema markup but it’s clearly an evolving area that I predict a lot more webmasters will be exploring in the near future. Do you use Schema markup yet? Has this article persuaded you that you should? I’d love to hear your thoughts in the Comments below.

If you’ve found this article helpful, can I ask you to use the social buttons below to spread the word? Thank you, it’s truly appreciated.

 

Hazel Jarrett About Hazel Jarrett

Hazel is an SEO Consultant based in Devon and works with businesses throughout the UK. She has a passion for making websites work effectively and a reputation for increasing traffic, leads and sales. With 15 years of SEO experience and research under her belt she knows what works and what to avoid. Follow Hazel on Twitter (@SEOPlusMore) and Google+

Comments

  1. Marie Gray says:

    So would it make sense to apply schema to blog posts and pages in the main navigation but not SERPs?

    • Hi Marie, yes it would absolutely make sense to apply schema to any blog posts and pages if it is likely to add value and influence your potential customers. Giving searchers more information so that they can decide more intelligently whether your search result is the best fit for them will attract the right clickthroughs and increase your conversion rate.

  2. Blimey, you learn something new every day. I shall as they say have a go. Thank you for a great post.

  3. isabela xela says:

    Pretty clear advice, just in time, when I need it. Thank you for sharing

Speak Your Mind

*

* Copy This Password *

* Type Or Paste Password Here *