Crystallize logo

Semantic web with structured data

Psst: we are hiring remote frontend developers and backend developers.

Illustration of backend developer holding a laptop against a designer holding a picture of cat

By using structured data to describe your web pages you are contributing to a more semantic web. This is a web where we describe the data being shown and not just how it should look, making it machine readable. Structured data is also used by Google to enhance search results. Here is how you can add, test and verify that your web pages are properly structured for the semantic web - as Google sees it. An important skill for better Internet craftsmanship.

What is the semantic web?

The goal of the semantic web is to make the World Wide Web machine readable. Using formats like Resource Description Framework (RDF) typically serialized in JSON-LD.

Following is an example of a JSON representation of a person. Here you see that there is a semantic description of the name and job title. This applies semantic meaning to the content:

{
"name": "Barack Obama",
"givenName": "Barack",
"familyName": "Obama",
"jobTitle": "44th President of the United States"
}

Structured data

Currently the biggest benefit of structured data is that Google is using this to enhance search results. By describing your web pages with structured data you can get enhanced results in Google when people are searching. This makes your content stand out more in search results. 

Examples of types of structured data that Google uses for enhancements are:

  • Article
  • Book
  • Carousel
  • Event
  • Product
  • Job posting
  • Recipe
  • Video
Structured data for videos Google search results

How to add structured data

To add structured data to your website you, or your web developers, simply need to add an inline script in your html. The example below adds the simplest structured data format that defines your organization's logo. View the search gallery that explains the different structured data formats that Google currently uses.

<html>
<head>
<title>About Us</title>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"url": "http://www.example.com",
"logo": "http://www.example.com/images/logo.png"
}
</script>
</head>
<body>
</body>
</html>

Rich results testing tool

The most important tool for testing your web pages against structured data is the rich results test by Google. This tool allows you to test any URL for rich results. A very useful tool during development to ensure that you have all the structured data for an enhanced search experience.

Rich results test tool screenshot

Verifying structured data indexed by Google

To verify that your webpage is indexed by Google and that the enhancements for structured data is understood correctly you can use the Google Search Console tool. This tool allows you to verify any URL linked to a domain you have verified. You can also see the enhancements like job positions and videos indexed by Google. Very useful.

Search console URL inspection screenshot