HtmlHow-ToBeginner · 4 min read

How to Add Structured Data in HTML for Better SEO

Add structured data in HTML by embedding JSON-LD inside a <script type="application/ld+json"> tag within the <head> or <body>. This helps search engines understand your page content better.

📐

Syntax

Structured data is added using a <script> tag with type="application/ld+json". Inside this tag, you write JSON following schema.org vocabulary to describe your content.

<script type="application/ld+json">: Declares JSON-LD structured data.
JSON object: Contains key-value pairs describing your page (e.g., @context, @type, name).
</script>: Closes the script tag.

html

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Thing",
  "name": "Example Name"
}
</script>

💻

Example

This example shows how to add structured data describing a local business. It uses JSON-LD inside a script tag in the HTML head.

html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Local Business Example</title>
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "LocalBusiness",
    "name": "Friendly Coffee Shop",
    "image": "https://example.com/logo.png",
    "address": {
      "@type": "PostalAddress",
      "streetAddress": "123 Bean St",
      "addressLocality": "Coffeeville",
      "addressRegion": "CA",
      "postalCode": "90210",
      "addressCountry": "US"
    },
    "telephone": "+1-555-123-4567"
  }
  </script>
</head>
<body>
  <h1>Welcome to Friendly Coffee Shop</h1>
  <p>Best coffee in town!</p>
</body>
</html>

Output

Page with heading 'Welcome to Friendly Coffee Shop' and paragraph 'Best coffee in town!' visible in browser.

⚠️

Common Pitfalls

Not using type="application/ld+json" causes browsers to ignore the structured data.
Placing invalid JSON inside the script tag breaks parsing; always use valid JSON syntax.
Using outdated or incorrect schema.org types can confuse search engines.
Embedding structured data inside visible HTML elements instead of a script tag is incorrect.

html

<!-- Wrong: Missing type attribute and invalid JSON -->
<script>
{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "John Doe"
}
</script>

<!-- Right: Correct type and valid JSON -->
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "John Doe"
}
</script>

📊

Quick Reference

Part	Description
	Ends the JSON-LD block

✅

Key Takeaways

Always add structured data inside a