What is Schema Markup and How to Use It?

Schema Markup is of great significance for SEO. With Schema Markup, you can explain to search engines how your data is structured. This enables Google and others to display your content in a user-friendly manner—such as a recipe, movie, or business (more on that later). In this article, you’ll learn the most important things about Schema Markup—stay tuned! In detail, we’ll cover the following:

1. Introduction to Schema.org
2. Benefits of Implementing Schema Markup
3. Implementation of Schema Markup
4. Future of Schema Markup
5. Helpful Tools

---

1. Introduction to Schema.org

Schema.org assists in the implementation of Schema Markup. You already got a rough description of Schema Markup above, but now let’s dive deeper: What is Schema.org?

1.1 What is Schema.org?

The official website describes Schema.org as follows:

Schema.org is a collaborative, community activity with a mission to create, maintain, and promote schemas for structured data on the Internet, on web pages, in email messages, and beyond.

So, Schema.org is a group that aims to design schemas for the Internet, websites, emails, and more. Schemas are understood as the structure of data. But beware: Schema.org is not just any group of ambitious nerds; it was founded by Google, Microsoft, Yahoo, and Yandex.

Collaboration of Search Engines and the Value of Structured Data

For major search engines (Google, Bing, Yahoo, etc.), finding structured data on websites is of immense value—an article becomes not just a machine-hard-to-understand text but a structured dataset with author, publication date, an image, and various other peripheral information. The first important takeaway? Schema Markup is important for search engines.

Rich Results and SEO Benefits

Proper implementation is rewarded by search engines—not only with higher SEO rankings (ideally) but also with so-called Rich Results in search results.

What are Rich Results? Rich Results are an enhanced form of search results that significantly improve the user experience with additional visual or interactive elements and functionalities. You’ve surely seen them on Google: Local businesses, books, instructional videos, movies, recipes—these types of content are often displayed differently. For example, like this: You can find a list of all the schemas supported by Google here: Structured Data Markup Supported by Google Search | Google Search Central | Documentation | Google for Developers

1.2 Types of Schema Markup

There are incredibly many schemas on Schema.org. Truly a lot. You can find a list of all schemas on the official website.

There are three different ways to incorporate schemas into a website: Microdata, JSON-LD, and RDFa. The most common variants, in my opinion, are Microdata and JSON-LD. But what are they?

What is JSON-LD?

JSON-LD stands for “JavaScript Object Notation for Linked Data.” JSON-LD allows linked data to be represented in JSON format. I’ll cover Microdata in more detail later and show you how to use it.

What is Microdata?

Microdata is simply a selection of elements or properties in HTML5 that provide search engines with more information about specific data on the website. There’s a good explanation with examples of Microdata on the official website. I’ll cover Microdata in more detail later and show you how to use it.

---

2. Benefits of Implementing Schema Markup

I’ve already briefly explained the benefits of Schema Markup, but here I’ll provide more detail. There are 3 central benefits of Schema Markup.

1. Improved Search Results and User-Friendliness

In May 2018, Google published a case study on Rakuten. According to Google, Schema Markup would have increased visits to Rakuten through search engines by 2.7 times and session duration by 1.5 times! In another case study on Eventbrite, it’s mentioned that Eventbrite achieved a 100% growth in pageviews to event pages (year-over-year) using structured event data. ZipRecruiter and StyleCraze can achieve similar remarkable results with structured data and Schema Markup. These are totally different companies in completely different industries, but the schemas are so versatile that there’s something for everyone. What does this mean for you? Schema Markup is a true game-changer!

2. Chance for Improved SEO Ranking

Whether the use of Schema Markup directly influences your website ranking is debated. However, as shown in the examples mentioned above, Schema Markup can improve core metrics like Click-Through Rate (CTR) or time spent on the website—and these factors do impact SEO ranking.

It’s quite simple: Schema Markup provides a straightforward way to make search results more user-friendly and rewards you with more traffic and a better SEO ranking. So, what are you waiting for?

3. Voice Search

Voice search is becoming more popular and important. Voice search involves using voice assistants like Siri, Alexa, or Google Assistant.

Therefore, Google has developed a beta feature that allows you to determine what Google provides as voice search results. So, you see: Schema Markup remains relevant for the future too!

---

3. Implementation of Schema Markup

Now, let’s get into the nitty-gritty! You now know the benefits of Schema Markup, understand what it is and who’s behind it. But even now, you might still not know how to actually use it—so, let’s get started!

Implementing Schema with JSON-LD

Google has excellent content on this topic. Here’s a very good article: Introduction to How Structured Data Markup Works | Google Search Central | Documentation | Google for Developers. Here’s an example from that article:

<html>
   
  <head>
       
    <title>Apple Pie by Grandma</title>
       
    <script type="application/ld+json">
      {
        "@context": "https://schema.org/",
        "@type": "Recipe",
        "name": "Apple Pie by Grandma",
        "author": "Elaine Smith",
        "image": "https://images.edge-generalmills.com/56459281-6fe6-4d9d-984f-385c9488d824.jpg",
        "description": "A classic apple pie.",
        "aggregateRating": {
          "@type": "AggregateRating",
          "ratingValue": "4.8",
          "reviewCount": "7462",
          "bestRating": "5",
          "worstRating": "1"
        },
        "prepTime": "PT30M",
        "totalTime": "PT1H30M",
        "recipeYield": "8",
        "nutrition": {
          "@type": "NutritionInformation",
          "calories": "512 calories"
        },
        "recipeIngredient": [
          "1 box refrigerated pie crusts, softened as directed on box",
          "6 cups thinly sliced, peeled apples (6 medium)"
        ]
      }
    </script>
  </head>
   
  <body>
     
  </body>
</html>

The part that’s important for you now is the content of <script type="application/ld+json">. Instead of “Recipe,” you can use any other schema type (for example, “Movie”). As mentioned before, you can find a list of all types on the official website.

Additionally, there’s a fantastic tool that can generate the script for you: Schema Markup Generator (JSON-LD). Another tool from Google can help you too: Structured Data Markup Helper

Implementing Schema with Microdata

For simplicity, I’ll use the example from the Schema.org website.

To explain the use of Microdata, let’s consider the “Movie” type. Imagine a simple website where the movie “Avatar” (a great movie, by the way) is presented. The HTML for this might look something like:

<div>
  <h1>Avatar</h1>
  <span>Director: James Cameron (born August 16, 1954)</span>
  <span>Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>

If you want to incorporate Schema Markup, you should first identify the element containing all the information. In this case, all the movie information is within the “div” element. You need to add the “itemscope” tag to this div element. This informs the search engine that information is nested here.

<div itemscope>
  <h1>Avatar</h1>
  <span>Director: James Cameron (born August 16, 1954) </span>
  <span>Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>

Once you’ve done that, you can directly specify the schema type. In our case, we are showcasing a movie, so we use the “Movie” type:

<div itemscope itemtype="https://schema.org/Movie">
  <h1>Avatar</h1>
  <span>Director: James Cameron (born August 16, 1954)</span>
  <span>Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html">Trailer</a>
</div>

We now provide the remaining information about the movie using the “itemprop” attribute.

<div itemscope itemtype="https://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span
    >Director: <span itemprop="director">James Cameron</span> (born August 16,
    1954)</span
  >
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer"
    >Trailer</a
  >
</div>

You can derive various properties (also known as attributes) of the “Movie” schema on the official website. These properties include attributes such as Genre, Name, or Director. The data is already present in our HTML. To precisely explain to search engines where to find which data, we utilize the “itemprop” attribute (see example).

Validating Your Implementation

Great job! You have now integrated Schema Markup. It’s actually quite simple once you understand it, isn’t it? (🤫 Psst, if you haven’t understood it yet, feel free to send me a message).

But how can you ensure that the Schema Markup has been correctly integrated? Don’t stress about it: Google comes to the rescue! Just take a look at this page, and you’ll find all the information you need.

---

4. Future of Schema Markup

Schema Markup is constantly evolving. Therefore, it’s important to stay up-to-date to ensure that your website remains optimized. Particularly intriguing is the future of Schema Markup for voice search via voice assistants like Google Assistant, Alexa, or Siri. You can always find the latest information on the official website as well as the official blog.

---

5. Helpful Tools

Here is a brief compilation of tools that can assist you with Schema Markup.

• Schema Markup Generator (JSON-LD)
• Google’s Rich Result Test Tool
• Structured Data: Markup Helper

---

Conclusion

You’ve learned a lot from this article! You now understand that Schema Markup is important for structuring your data in a way that helps search engines understand it. So, what are you waiting for? Implement Schema Markup on your website today! Have fun, and thank you for your attention.