🥳 You have completed all topics in the Handbook. Click here to claim your certificate!

2. Structured data

Sometimes the content of the page alone is not enough to accurately tell search engines what the page is about. By using structured data, you can annotate the page (or different parts of it) to help search engines index it for different types of search features.

Structured data itself just refers to data that is organized and formatted in a way that makes it easier for both humans and machines to make sense of it. Structured data often follows a schema that dictates how the data should be organized.

In the context of the web, structured data typically refers to a certain schema and markup combination that lets you annotate a web page with more details about its individual parts.

Search engines can then consume this information to produce search features.

The functionality of structured data is purely semantic. It doesn’t show up on the page, and the user can’t interact with it. It’s just additional data about individual elements, and the purpose of structured data is to give search engines (and other similar services) a better understanding of what the page is about.

Example

If you have a web page with a recipe, you could add markup to the individual HTML elements that represent the recipe’s components, such as its ingredients, its ratings, and its preparation time.

When the search engine then indexes the content, it makes note of this structured data and might use it to enrich the search engine results page (SERP).

An example of an enriched result in search engine results. The image, ratings, and preparation time all come from structured data that was added to the recipe page.

It’s a good idea to add structured data to web content, because that way you’ll add additional signals for search engines to understand your content subject matter. Hopefully, search engines will then enable additional features using this structured data, which can then improve the click-through rate to your content.

Just note that adding structured data is unlikely to directly result in better ranking in search engine results for your content. However, the potentially enriched result displays might invite users to click through to the content more readily, which in turn increases traffic to your website.

Don’t miss this fact!

Using structured data doesn’t guarantee a special SERP feature, nor does it guarantee better rankings or a better click-through-rate. However, adding structured data can improve your visibility in search results, so it’s a good idea to invest in making it work.

Another thing to keep in mind is that structured data is only helpful if it’s relevant and matches the content it is describing. Especially when using JSON-LD (see below), it’s common to have the semantic layer fall out of sync with the rest of the page. 

In this case, the structured data can actually be counter-productive, because search engines will not be able to trust it as it does not accurately describe the content on the page.

As a technical marketer, you should be aware of the different approaches for adding structured data to a page. Figuring out opportunities to enrich the semantic content of the page is one of the ways to contribute to optimizing the content for search engines.

Schema.org markup

Schema.org is a community-driven, vendor-sponsored, collaborative effort to build a common vocabulary for semantic markup on the web.

With the specifications in Schema.org, you can add a layer of detail to your web content to clearly annotate what the content is about.

There are many different formats for adding the structured data to the page (see below), but here’s an example using microdata (HTML tags and attributes).

<!-- No microdata added -->
<div>
  <h1>The best meatloaf in the world</h1>
  <p>By Simo Ahava</p>
  <img alt="Meatloaf on a plate" src="meatloaf.webp" />
  <p>This is a delicious meatloaf recipe.</p>
  <p>
    <span>Prep time: 10 minutes</span>
    <span>Cook time: 45 minutes</span>
  </p>
</div>

This (partial) recipe text in itself is clear, but search engines might have a hard time figuring out which content is relevant for enrichment. To help them, you could add the metadata like this:

<!-- Microdata added -->
<div itemscope itemtype="https://schema.org/Recipe">
  <h1 itemprop="name">The best meatloaf in the world</h1>
  <p>By <span itemprop="author">Simo Ahava</span></p>
  <img itemprop="image" alt="Meatloaf on a plate" src="meatloaf.webp" />
  <p itemprop="description">This is a delicious meatloaf recipe.</p>
  <p>
    <span>Prep time: <meta itemprop="prepTime" content="PT10M">10 minutes</span>
    <span>Cook time: <meta itemprop="cookTime" content="PT45M">45 minutes</span>
  </p>
</div>

Here you can see how the additional attributes such as itemprop don’t add any additional information to the text content itself, but they are included in the HTML markup. Search engines can then consume this markup to better understand what the content is about.

Structured data is also useful for normalizing expressions that might often be displayed in different ways. Date and time are two such things. 

In the example above, the preparation time is given as “10 minutes”, but it could have just as well been written as “ten minutes” or “00:10:00” or “10:00”. The meta tag uses the attribute value PT10M to normalize these differences.

JSON-LD and other formats

There are different formats for expressing the Schema.org markup.

In the example above, microdata was used to annotate the relevant HTML elements themselves. It’s a very semantic approach, and it encodes both the syntax and the semantics for annotating content.

These days structured data is most often delivered with JSON-LD (JavaScript Object Notation for Linked Data).

JSON-LD annotation is done on a separate layer from the HTML elements themselves. It’s similar to the Data Layer in that its sole purpose is to dictate the semantics of structured data on the page.

For example, instead of adding microdata and/or RDFa directly to the HTML elements of the recipe snippet, there could be a JSON-LD block in the beginning of the HTML markup, completely separate from the recipe code itself:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Recipe",
  "author": "Simo Ahava",
  "prepTime": "PT10M",
  "cookTime": "PT45M",
  "description": "This is a delicious meatloaf recipe.",
  "image": "meatloaf.webp",
  "name": "The best meatloaf in the world"
}
</script>

JSON-LD is popular because it’s simple. You no longer need to link semantic data with the HTML elements themselves. Instead, you just need to list all the semantic content that search engines should consume in a block of information in the HTML markup itself.

Deep Dive

RDFa for structured data

RDFa (Resource Description Framework in Attributes) is a somewhat similar way of encoding the semantics into HTML elements directly. However, RDFa only specifies the syntax of annotation – you can use it to freely combine different vocabularies of structured data.

<!-- Recipe annotated with RDFa -->
<div vocab="https://schema.org/" type="Recipe">
  <h1 property="name">The best meatloaf in the world</h1>
  <p>By <span property="author">Simo Ahava</span></p>
  <img property="image" alt="Meatloaf on a plate" src="meatloaf.webp" />
  <p property="description">This is a delicious meatloaf recipe.</p>
  <p>
    <span>Prep time: <meta property="prepTime" content="PT10M">10 minutes</span>
    <span>Cook time: <meta property="cookTime" content="PT45M">45 minutes</span>
  </p>
</div>

Enriched results

Whenever you do a search for information and find a result that looks enriched or otherwise pleasing to the eye, it’s a useful exercise to open that link and then look through the HTML source to see how it’s annotated.

For example, here is a search for “Contact movie”, with the intent of finding information about one of the best movies of all time. At the top of the listings, there’s the IMDB entry that looks enriched:

As you can see, IMDB has added a rating in addition to votes and some quick links. Even though the rating is absurdly low (this movie deserves a 9.5/10 at minimum), it’s useful extra information when determining if this is what you should dedicate your movie night to.

Opening the page and inspecting the HTML source, you can see this:

In this JSON-LD block, there are a number of things that have been utilized in the search engine results page entry.

“description” is used to generate the short snippet below the title. 

“aggregateRating.ratingValue” generates the average rating for the entry, and “aggregateRating.ratingCount” is the count.

The title of the page Contact (1997) doesn’t come from the JSON-LD but rather the <title> attribute of the HTML source itself, and the quick links at the bottom are derived dynamically from the content.

It’s thus important to understand that adding structured data doesn’t guarantee that the enrichment will appear in all search results, nor does it guarantee that only the structured data will be used for enrichment.

Search engines might divert from your structured data suggestions if they are confident that they have even better information available elsewhere in the HTML markup.

Key takeaway #1: A schema instructs the form and function

While you are free to annotate your content however you like, if you want search engines to make use of it, you need to follow their schema. There’s usually a very specific syntax and semantic structure to how the structured data needs to be applied to the page, and if you divert from this, the search engine might ignore the annotations altogether.

Key takeaway #2: Structured data can enrich the SERP

Even though structured data is useful in giving additional information to search engines about the content, a good reason to add structured data is the chance that your content might get enriched in the SERP. If the search engine decides to do this, it means that your content might be displayed more prominently with a featured image or with other, relevant annotations.

Key takeaway #3: JSON-LD is a good way to start annotating

JSON-LD is a block of information you add to the page, separate from the rest of the content. Other annotation methods require you to add relevant information to the actual on-page elements themselves, whereas JSON-LD needs you to compile everything into a separate code block. This is often the easiest way to annotate, although this separation of concerns does mean that you need to be careful not to inadvertently include outdated information.

Quiz: Structured Data

Ready to test what you've learned? Dive into the quiz below!

1. Which of the following does structured data (arguably) impact the most?

2. What is the difference between JSON-LD and microdata?

3. Which of the following SERP features could be enabled when a recipe schema is being used in the structured data? Select all that apply

Your score is

0%

What did you think about this topic?

Thanks for your feedback!

Unlock Premium Content

Simmer specializes in self-paced online courses for technical marketers. Take a look at our offering and enroll in one or more of our courses!