A Guide to Schema Markup and Rich Snippets - Superb Digital | WebPhuket

In your research to understand more about how SEO can boost your site’s traffic, you might have come across the terms “Schema markup” and “rich snippets.” In this article, we’ll go into full detail about what these terms mean exactly, what they are used for, and how important they are to SEO.

Before I can explain Schema markup and rich snippets, however, we have to first talk about the concept that acts as the foundation for those two terms: structured data.

What is Structured Data?

Search engines have gotten better and better at figuring out what websites are generally about. Traditionally, Google would simply pull a text description out of your website’s meta description in the HTML and display that in the search results. If the text description was too long Google will clip this text.

However, search engines like Google have begun to present on-page information in a more organised and structured manner to better present it to its users. You may have seen this in the form of ‘rich snippets’ (more on this below) which break down information on a page.

Structured data is data in a page’s source code that is organised in such a way that helps search engines categorise that page and bring out more detailed descriptions in the search results. An element on a web document (e.g. a line of text listing out a store’s operating hours) is assigned a value that labels it as such for a search engine to recognise that element (e.g. as operating hours). This can be done across a number of content types, from recipes and events to reviews and places.

Structured data is also useful for removing ambiguity. With structured data in place, an online grocery store selling apples won’t show up in the search results for resellers of Apple consumer electronics.

There are different formats of structured data that search engines can understand. Think of these formats as vocabularies that certain websites and search engines share to communicate with each other. The one vocabulary that the biggest search engines prefer is Schema.

What is Schema Markup?

Schema is a vocabulary of tags used to mark up HTML (hence, Schema markup) in a website’s source code so that search engines can determine what type of content is on a page. With this understanding of a web page’s content, search engines can show additional information on SERPs for that web page that may prove useful for users.

Google, Yahoo!, Bing, and Yandex collaborated on the creation and development of Schema starting all the way back in 2011. It is an open-source project that is meant to streamline the way websites have their source codes marked up for search engines to easily interpret them. The entire vocabulary can be accessed on Schema.org.

Implementing Schema markup properly into a site produces rich snippets whenever a web page from that site shows up in Google’s SERPs.

What are Rich Snippets?

By default, Google and other search engines only show a text description underneath the link of a search result. This information can be enough for a lot of people to know whether a search result is relevant to what they are looking for online and to decide if they want to click on that link.

With Schema markup, a search result on Google, Yahoo!, Bing, or Yandex can show more than just a line of text. It can show a star rating that indicates how many good (or bad) reviews it’s gotten if the result is, for example, a restaurant or a movie. If it’s a brick and mortar store, the search result can show the physical address. If it’s an event, it can show the start and end dates.

This additional information presented in search results are called rich snippets. The type of rich snippet that will appear depends on the type of Schema markup used for a website.

Types of Schema Markup

There are a lot of types of Schema markup to account for the vast number of websites performing different kinds of functions. The database at Schema.org continues to add new ones to accommodate the growth and increasing granularity in identifying a web document’s elements.
Instead of listing down every single type of Schema markup, however, we’ll just mention the most commonly used ones:

A particular type of Schema markup has its own set of properties that can be used to label items that are commonly associated with that Schema markup. For example, a creative work such as a TV show can have properties like “numberOfEpisodes” to show how many episodes there are in a series, “director” to show who directed the series, and “productionCompany” to show the studio that produced the TV show.

3 Types of Code Languages

Schema markup can be implemented through three types of code languages:

1. Microdata

Microdata is the most basic code language for Schema markup implementation, specifically for websites built on HTML5. It uses tags that are added onto existing HTML tags on a web document’s source code.

It is straightforward to add, but the problem is that you need to do this for every single item you want to mark up, which can be a tedious process the more items there are on a page and the more pages there are on your site.
The most often used Microdata attributes are:

2. Resource Descriptive Framework in Attributes (RDFa)

RDFa is very similar to microdata in how it is used as extensions to existing HTML code. RDFa also has to be added onto every individual item that you want to mark up. It can be used with HTML, XHTML, and XML-based web documents.

Some of the basic RDFa attributes are:

3. JavaScript Object Notation for Linked Objects (JSON-LD)

JSON-LD is currently the most commonly used code language for schema markup implementation. In fact, Google recommends web developers use JSON-LD for that very purpose.

JSON-LD is different from the previous two code languages. Instead of having to mark up individual HTML tags, it is simply inserted at the top of a web document. It acts as general instructions for a search engine’s crawlers to identify all the important elements from the start. This makes it easy to use for people who don’t have much experience with coding.

The tags that are always present in JSON-LD code are:

Why is Schema Markup Important?

So with all the seemingly complicated coding foundation that needs to be laid down to implement Schema markup, you might be asking: Why go through all this trouble in the first place?

1. Improve Page Relevancy

There has yet to be any conclusive evidence that a website with Schema markup has any direct effect on its organic search rankings. Google Webmaster Trends Analyst John Mueller has outright stated that using structured data doesn’t give a ranking boost.

However, Mueller does go on to say that structured data may help with ranking because it helps Google understand how relevant a site is for a search term.

2. Increase Visibility in SERPs

Apart from improving a web page’s relevancy, structured data done right with Schema markup has the more obvious effect of increasing visibility in the SERPs. It’s much easier to catch the attention of a user going through a list of Google’s SERPs with a search result that has rich snippets than one that only has plain text.

3. Higher CTR

With increased visibility thanks to rich snippets, your site is likely to get more clicks whenever it shows up in SERPs than your competition that isn’t using Schema markup.

Schema.org estimates that only 10 million or so websites use Schema markup, which is less than 1% of all websites. The Association for Computing Machinery says that less than a third of Google’s search results have Schema markup rich snippets. To say that the field is wide open for you to take advantage of increased SERP visibility is an understatement.

4. Future-Proof Your Website

Lastly, you will be future-proofing your website for when Google and other search engines move on and fully adapt to “semantic search” instead of basing the relevancy of what they show on SERPs on keywords.

How Do I Implement Schema Markup?

It’s understandable to be intimidated by the amount of coding involved in implementing Schema markup. Not even all SEO specialists have the skills or the experience to do it comprehensively. Thankfully, there are tools that automate some parts of the process with no prior coding knowledge necessary.

Google’s Structured Data Markup Helper is one such easy-to-use tool you can use to mark up the most important elements on your website. Just input the URL or HTML code of the web page you want to mark up, choose the right Schema type, and start tagging elements.

Microdata Generator.com also has a free generator tool that can create JSON-LD code for various Business types. All you have to do is select the Business type and fill out the form.

After you’ve generated your codes using those tools, you can test if they work properly and if they support rich snippets using Google’s Rich Results Test. This tool can also be used to test code that has already been marked up in a live web page.

Get Started with Implementing Schema Markup

At first blush, structured data and Schema markup implementation can look like an overly technical and tedious task. The benefits are hard to deny, however, when everyone can clearly see the attention-grabbing influence of a search result with rich snippets standing out in the SERPs.

Of course, it will take time and patience to fully grasp all the intricacies and apply that knowledge correctly to achieve elegant source codes that Google recognises. This guide only serves as a jumping-off point toward comprehending these concepts.

Implementing schema markup is a technical exercise that requires a good knowledge of SEO, HTML and coding. If you’d rather leave this in the hands of the Schema markup experts, schedule a consultation with Superb Digital today and let’s talk about how we can help you.