What is schema markup?
Schema markup is a collaborative initiative that was spearheaded by search engines. It enables websites to display “richer” data on various platforms like Google, Microsoft, Yahoo, Yandex and even Pinterest.
Schema is a type of structured data, which is code in a specific format. It is written in such a way that search engines understand it as a semantic vocabulary. Schema tells a search engine what your data means, not just what it says.
Key Definitions
Before we get started, it’s important to wrap your head around a few key terms:
Structured Data – Code that you put on your website to help the search engines return more informative results for users.
Schema – A type of structured data that defines entities, actions, and relationships on the internet.
Rich Snippet – A snippet is a result Google shows to the user in the search results. A rich snippet shows extra information between the URL and the description.
JSON-LD – An implementation format for structuring data. Typically, in terms of SEO, JSON-LD is implemented leveraging the Schema.org vocabulary.
Why is schema markup important?
Without schema markup in place, the information on a web page is left open to Google’s interpretation. By not marking up your data, you run the risk of search engines misunderstanding the content of your page.
For example, if the name ‘Chris Evans’ is included on a webpage, although search engines will be able to read the name they may struggle to understand the specific person being referred to. ‘Chris Evans’ could refer to the English TV presenter and radio DJ, or it could refer to the Hollywood actor famous for playing Captain America. Another example would be ‘Harry Potter’ – are you talking about the books, the films, or the specific character? Implementing schema allows you to tell the search engine what kind of information you are presenting.
Schema and SEO
In the context of SEO and web design, schema markup can encourage more information to be displayed in SERPs. It then creates an enhanced description (commonly known as a rich snippet), which appears in search results. This is important because these rich snippets are much more eye-catching and engaging than a regular snippet, and can have a significant impact on click-through rates. Just look at the examples below – I know which result I would rather click on.
Types of schema markup
Schema can be industry-specific and valuable to certain companies depending on the vertical they operate in. You can find a full list of schemas available on the Schema.org website, but we’ve pulled out some of the main ones for SEO benefit with examples of how they look.
Organisation
An organisation such as a school, NGO, corporation, club, etc.
Local Business
A physical business or branch of an organisation. Examples of LocalBusiness include restaurants, branches of a restaurant chain, branches of a bank, medical practices, clubs, etc.
Product
Any offered product or service. For example: a pair of shoes, concert tickets, car rentals; a haircut, etc.
Breadcrumb
A set of links that can help a user understand and navigate a website hierarchy.
People
Fairly self-explanatory. A person (alive or dead, real or fictional).
Article
An article, such as a news article or piece of investigative report. Newspapers and magazines have articles of many different types and this is intended to cover them all.
FAQ Page
An FAQ Page is a WebPage presenting one or more “Frequently asked questions”. FAQ schema can trigger voice actions.
How To
Instructions that explain how to achieve a result by performing a sequence of steps. This can drive results on virtual assistants such as Google Home.
Event
An event happening at a certain time and location, such as a concert, lecture, or festival. Can be edited to include ticketing information via the offers property.
Job Posting
A listing that describes a job opening in a certain organisation.
Recipe
Again, fairly self-explanatory… for recipes. For dietary restrictions covered by the recipe, a few common restrictions can be included via suitableForDiet. The keywords property can also be used to add more detail.
How to add schema markup to a website
There are 3 main ways in which you can add schema to a web page:
- Generate the code using Schema Generator tools and ask a developer to implement
- Use the Data Highlighter tool in Google Search Console.
- Directly tag the HTML code on your web pages via Google Tag Manager
There are also some Schema plugins, particularly for WordPress sites, that can help to do the job for you.
How to add schema via Google Tag Manager
This is by far our most preferred way to implement schema markup because it requires minimal coding knowledge and is a relatively smooth process. By following these 5 steps, you should be able to get any type of schema added in no time.
1. Create the code
You’ll need to find the specific JSON-LD that you need using the Schema.org website. Be sure to customise this code with your specific information, and wrap it with the blue code as shown below. You should then check your code using the ‘Code Snippet’ function of the Structured Data Testing Tool.
<script>
(function() {
var jsonData = {
“@context” : “http://schema.org”,
“@type” : “Organization”,
“url” : “http://www.your-company-site.com”,
“contactPoint” : [
{ “@type” : “ContactPoint”,
“telephone” : “+1-401-555-1212”,
“contactType” : “customer service”
}
},]};
var el = document.createElement(‘script’);
el.type = ‘application/ld+json’;
el.innerHTML = JSON.stringify(jsonData);
document.head.appendChild(el);
})();
</script>
2. Create a trigger
In Tag Manager, create a Page View trigger using the exact URL of the page that you want to add the schema to.
3. Create a custom HTML tag
Copy and paste your code in, and apply the Page View trigger that you just created.
4. Preview and publish
Use preview mode to check your changes in the wild. If you’re happy, you can then publish the changes.
5. Check your implementation
Check using the Structured Data Testing Tool to see if the code is working as it should.
You can also run your web page through the Rich Results Test tool.
