Skip to main content

Structured Data — JSON-LD & Microdata

Mentor's Note: Structured data is the bridge between your content and how search engines understand it. Without it, Google has to guess what your page means. With JSON-LD or Microdata, you tell the search engine exactly what things are — a recipe, a product, an event — and it rewards you with rich snippets that dominate search results. This is one of the highest-ROI SEO techniques you can learn.

What is Structured Data?

Structured data is a standardized format for providing information about a page and classifying its content. It uses Schema.org vocabulary (a joint effort by Google, Microsoft, Yahoo, and Yandex) to annotate elements on your page so search engines can understand and display them in enhanced ways — called rich snippets.

Think of it as adding labels to your content: "this is a recipe with these ingredients and this cook time," or "this is an event happening at this date and location."

Why It Matters

Rich snippets make your search result stand out. They can include:

  • Star ratings (reviews)
  • Price and availability (products)
  • Cook time and calories (recipes)
  • Event dates and locations (events)
  • FAQ accordions (questions and answers)

Pages with rich snippets see significantly higher click-through rates — sometimes 30-50% higher than plain results.

JSON-LD Format

JSON-LD (JavaScript Object Notation for Linked Data) is Google's recommended format. You place a <script> block in the <head> or <body> of your page. It's separate from your HTML, making it clean and easy to maintain.

<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Article",
"headline": "Complete Guide to Structured Data",
"author": {
"@type": "Person",
"name": "Jane Doe"
},
"datePublished": "2026-03-15",
"image": "https://example.com/photo.jpg"
}
</script>

Microdata Format

Microdata embeds structured data directly into your HTML tags using itemscope, itemtype, and itemprop attributes. It's more tightly coupled to your markup but doesn't require a separate script block.

<article itemscope itemtype="https://schema.org/Article">
<h1 itemprop="headline">Complete Guide to Structured Data</h1>
<p itemprop="author" itemscope itemtype="https://schema.org/Person">
By <span itemprop="name">Jane Doe</span>
</p>
<time itemprop="datePublished" datetime="2026-03-15">March 15, 2026</time>
<img itemprop="image" src="photo.jpg" alt="Structured Data Guide">
</article>

Common Schema Types

Schema TypeUse ForProperties
ArticleBlog posts, newsheadline, author, datePublished, image
CourseEducational contentname, description, provider
RecipeCookingname, ingredients, cookTime
ProductE-commercename, price, availability
EventEventsname, startDate, location
FAQPageFAQsmainEntity (Question/Answer)
LocalBusinessPhysical businessname, address, phone
PersonPeoplename, jobTitle, url

Testing Tools

Always validate your structured data before deploying:

Complete Example

Here's a full tutorial page with JSON-LD structured data:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>How to Bake Sourdough Bread</title>

<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Recipe",
"name": "How to Bake Sourdough Bread",
"author": {
"@type": "Person",
"name": "Chef Marco"
},
"datePublished": "2026-05-01",
"description": "A step-by-step guide to baking perfect sourdough at home.",
"prepTime": "PT30M",
"cookTime": "PT45M",
"totalTime": "PT1H15M",
"recipeYield": "1 loaf",
"recipeCategory": "Bread",
"recipeCuisine": "American",
"image": "https://example.com/sourdough.jpg",
"recipeIngredient": [
"500g bread flour",
"350g water",
"100g sourdough starter",
"10g salt"
],
"recipeInstructions": [
{
"@type": "HowToStep",
"text": "Mix flour, water, and starter. Let rest 30 minutes."
},
{
"@type": "HowToStep",
"text": "Add salt and knead for 10 minutes."
},
{
"@type": "HowToStep",
"text": "Bulk ferment for 4 hours with folds every 30 minutes."
},
{
"@type": "HowToStep",
"text": "Shape and proof overnight in the refrigerator."
},
{
"@type": "HowToStep",
"text": "Bake at 450°F for 45 minutes in a Dutch oven."
}
],
"nutrition": {
"@type": "NutritionInformation",
"calories": "180 calories per slice"
}
}
</script>
</head>
<body>
<h1>How to Bake Sourdough Bread</h1>
<p>By Chef Marco — Published May 1, 2026</p>
<p>A step-by-step guide to baking perfect sourdough at home.</p>
<!-- page content -->
</body>
</html>

Common Mistakes

  • Missing required properties — each Schema type has required fields; omitting them means your rich snippet won't appear
  • Wrong @type or @context — always use https://schema.org (with s) and the exact type name
  • Mismatched data — structured data must match visible page content (lying gets you penalized)
  • Nested types without @type — child entities (like author) need their own @type
  • Using outdated schema — always check Schema.org for the latest types and properties
  • Only using one format on the same page — avoid mixing JSON-LD, Microdata, and RDFa for the same entity