Performance & UX
·5 min read

Quickstart: Understand Structured Data in Less than 10 Minutes

Taking SEO (Search Engine Optimization) into account when building your website is an essential part of your end user’s business strategy. It helps improve the quantity and quality of visitors and makes the site rank better in Google’s recommendations to create trust and credibility.

When building a site that’s optimized for SEO, you’ll explore topics like improving Core Web Vitals, using the most optimized technologies, and more. When you reach more advanced levels of SEO optimization, you’ll likely encounter the idea of structured data — special type of information you can provide in your website’s code to help search engines better understand and display your content.

Today, we’ll dive into understanding what structured data is, what it helps with, how it works, and how you can implement it on your website.

What is structured data?

Structured data, which is an implementation of schemas, is specially formatted data that helps search engines easily find information about and understand the type of content on your website so they can index and display it correctly in search results. Some types of structured data are even used to create “rich results,” which are the visually enhanced search results that you sometimes see when using Google, for example. They’re based on schemas, which are data types that many search engines have agreed to recognize in order to create a shared language for crawling and understanding the internet.

How does structured data work?

In case you are not familiar with structured data, it’s made up of JSON data structures, defined through a set of commonly agreed-upon schemas. You add these structures within the <head> tag of your website (ideally) or within <script> tags elsewhere on a page. There are specific JSON data structures that Google and other search engines use to understand a variety of content types. Some examples include:

For a full list of structured data that Google recognizes, check out this resource.

Because these data structures clearly identify which information you’re providing to the search engine, and they do so in a consistent manner, it’s easier for search engines to understand information about a page (e.g. with an article, the title is always found under “headline” in the data structure, so it’s easy to pull that information for search results).

Let’s look at an example to see structured data in action: imagine you write for a cooking blog and add structured data to each recipe.

When a user does a search about recipes, your page’s structured data will help search engines understand that your content is a recipe and create specially formatted results, like the cards below, when users search for recipes specifically.

When a recipe blog post contains recipe structured data, Google can display it as a card in a "Recipes" carousel at the top of search results. Structured data can help Google understand things like how long it takes to make a recipe and then display that information on the card.

Be sure to follow content guidelines

It’s important to note that most types of structured data that Google, for example, recognizes also have guidelines for the content they contain and how they’re used (for example, here are the content guidelines for recipe structured data). If these guidelines aren’t observed when using this markup, Google might flag you for using it in a “spammy” way, and at a minimum, search engines aren’t likely to implement rich results based on inappropriate use.

Does structured data help SEO?

Adding structured data to your website is beneficial for SEO because it makes it easier for search engines to understand your content, and rich results often appear at the top of search engine results pages, thus outranking others more easily.

In other cases, such as when adding FAQ structured data to a page, you’ll find that your search result takes up more visual space than others, making it more prominent and, thus, more clickable. Here’s an example of how we’ve used FAQ structured data to enrich the search results for our blog.

On Prismic's blog, we've implemented FAQ structured data on our posts that include frequently asked questions. This causes the search results for those posts to display the questions in our structured data along with drop-downs containing the answers. With this information, readers can better understand our search result, and the result is more visually prominent, helping us rank higher than other options.

Improving clickability in this way can help your content improve its ranking steadily over time.

Build the most performant websites

Join other developers on the leading edge of development and subscribe to get monthly insights on creating websites that are performant and deliver maximum business value.

When should you use structured data?

Whether a website needs structured data or not can depend on its business goals. However, if one of those goals is to generate organic traffic, it’s worth exploring whether there are any structured data types that work for your content. Google provides a great guide to all of the possibilities, along with previews of how a given data structure might enrich your search result.

One of the most common structured data types that you’ll see is the article type, which is used for news or blog articles. It’s used to help search engines display information that’s useful about a given blog. Here’s an example lightly adapted from Google to show what an article’s structured data might look like.

<html>
  <head>
    <title>Structured Data Adds SEO Power</title>
		<!-- Other important head elements here -->
		<!-- Below, the structured data is added within a script tag -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "NewsArticle",
      "headline": "Structured Data Adds SEO Power",
      "image": [
        "https://example.com/photos/1x1/photo.jpg",
        "https://example.com/photos/4x3/photo.jpg",
        "https://example.com/photos/16x9/photo.jpg"
       ],
      "datePublished": "2015-02-05T08:00:00+08:00",
      "dateModified": "2015-02-05T09:20:00+08:00",
      "author": [{
          "@type": "Person",
          "name": "Paulina Gavilán",
          "url": "https://example.com/profile/paulina"
        },{
          "@type": "Person",
          "name": "John Doe",
          "url": "https://example.com/profile/johndoe123"
      }]
    }
    </script>
  </head>
  <body>
		<!-- Your website's code here. -->
  </body>
</html>

How can you add structured data to your website?

Adding structured data to your website has two essential elements:

  1. First of all, you’ll need to add the appropriate JSON data structure to your webpage. In fact, to get the best results with structured data, you probably want to provide an interface in a CMS that allows users to easily add and update structured data without editing the code manually every time.
  2. Secondly, you or your team need to update the content of each page to be sure that it adheres to the content guidelines for the type of structured data you’re trying to use.

Depending on your website, there are multiple ways you can achieve these steps. We’ll list a few approaches below.

It’s worth noting that if you’re interested in investing in the SEO of your website and you haven’t heard about headless content management systems yet, it’s a topic you should explore. Headless products allow you to accomplish maximum technical SEO optimization on your website, and a headless website builder like Prismic can then help you create rich content experiences that ultimately enhance your on-page SEO.

Using a headless content management product

With headless content management products, your website is divided into a few key components. There’s the content management system (which could be a headless website builder like Prismic), and then there’s the front end of your website. With Prismic, you can create a customized page builder interface that makes it easy to add and update structured data, while using our API to connect the data to the fully custom and optimized front-end code of your site.

So, if you’re using a headless product, setting up structured data is relatively simple. You’ll simply need to

  1. Add the appropriate custom fields to your page templates. With Prismic, you can do this using Slices, which are essentially building blocks that are available within your custom page builder.
  2. Then ensure that you use the dynamic data in the front-end code of the website through our API.

Here’s a complete guide on how to implement structured data with Prismic.

Using WordPress

If you’re not yet ready to invest in the benefits of a headless product for your SEO and your website is currently powered by WordPress, your best bet is to use a plugin.

It is possible to manually add structured data within WordPress using <script> tags and free online tools that will generate the data for you, but this method isn’t recommended because it will be difficult to manage and update your structured data later on. From time to time, there are updates to how structured data is formatted, which a plugin is likely to help you manage, rather than you needing to manually find and update every schema JSON you’ve ever added to your pages.

Here’s a guide to the top plugins for adding structured data to your website.

Final thoughts

All in all, structured data can help your team take your website’s SEO to the next level. While implementing it can be relatively simple, it’s important to do so in a scalable way to minimize the impact of future updates to the schema formats. It’s also important that you’re mindful of following content guidelines like Google’s for each schema because using them improperly can, at best, make search engines not use your structured data, and at worst actually negatively impact your SEO.

Article written by

Paulina Gavilán

Support engineer and technical writer here at Prismic, bringing you informative content in the docs and friendly help in the forum.

More posts
Paulina Gavilán

Join the discussion

Hit your website goals

Websites success stories from the Prismic Community

How Arcadia is Telling a Consistent Brand Story

Read Case Study

How Evri Cut their Time to Ship

Read Case Study

How Pallyy Grew Daily Visitors from 500 to 10,000

Read Case Study