Skip to content
RankThat

JSON-LD

JSON-LD (JavaScript Object Notation for Linked Data) is the format Google recommends for adding structured data. It sits in a script tag, separate from the visible HTML.

There are three ways to write structured data: Microdata, RDFa and JSON-LD. The first two weave attributes into your visible HTML tags. JSON-LD keeps everything in one block of code, usually in the page’s <head>, that browsers ignore and search engines read. Google recommends JSON-LD because it’s easier to add, maintain and debug without touching the page layout.

Why it matters

For a WordPress site like Coastline Plumbing’s, JSON-LD means schema can be added or changed by a plugin without editing theme templates. A developer can update the business hours in one place, and nothing on the page moves. With Microdata, the same change would mean finding the right <span> attributes scattered through the template.

Example

Here is BreadcrumbList markup for a service page:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    { "@type": "ListItem", "position": 1, "name": "Home", "item": "https://www.example.com/" },
    { "@type": "ListItem", "position": 2, "name": "Services", "item": "https://www.example.com/services/" },
    { "@type": "ListItem", "position": 3, "name": "Water heater repair" }
  ]
}
</script>

The last item can leave out item because it’s the current page.

How it fits together

  • @context says which vocabulary you’re using, almost always https://schema.org.
  • @type names the thing being described.
  • Properties describe it. Nested objects (like an address inside a LocalBusiness) carry their own @type.
  • @graph lets you put several connected items in one block, and @id lets one item refer to another. Yoast and Rank Math both output schema this way.

Common mistakes

  • Invalid JSON. A trailing comma or a curly “smart quote” pasted from a word processor breaks the whole block. Google ignores it silently.
  • Markup that disagrees with the page, such as a price in JSON-LD that differs from the price shown.
  • Injecting it late with JavaScript. Google can read JSON-LD added by JavaScript, but it depends on rendering working correctly (see JavaScript SEO). Server-side output is safer.
  • Duplicate blocks from a theme and a plugin describing the same business differently.

How to check

Paste a URL or code snippet into Google’s Rich Results Test, which reports syntax errors and missing required properties. The free Schema Generator produces valid JSON-LD for common types if you’d rather not write it by hand, and the output follows schema markup conventions Google supports.

Do this month’s SEO in an afternoon.