Code

To Grow Search Traffic, Add JSON-LD

Presumably every ecommerce site wants to improve its organic search traffic.

But a limiting factor with search engines has been their need to analyze huge quantities of HTML data, which is often complex, non-standard, and, in many cases, broken. The fact that search engines (and browsers) are able to extract and present something usable out of that mess has always amazed me.

Structured data is information about a web page that helps search engines understand its contents. Instead of having to figure out what a page is about from parsing the entire HTML document, search engines can simply analyze the structured data.

What Is JSON-LD?

JSON-LD is one format of structured data. Google is now recommending that all sites use it.

The benefit of JSON-LD over other types of structured data, such as microformats or RDFa, is that JSON-LD doesn’t have to be interspaced within your HTML. The other formats require you to change your HTML, adding elements and attributes to show where each part of the structured data is located on your page.

With the design changes ecommerce stores go through, it’s easy to make a mistake and alter the HTML so it’s no longer presenting valid structured data elements. Invalid elements usually mean that the search engines will ignore your structured data.

These errors can be difficult to find. I had one customer who thought he had structured data on his store, but it had, instead, been invalid for over a year. That’s a year his site was at a disadvantage in search results.

In contrast, JSON-LD in embedded in HTML as a block of JSON data. It won’t affect how your HTML looks. It’s just a block of data that is invisible to regular users.

Easy to Add

Since JSON-LD is based on JSON, a popular data format, many web developers can create or update it. If your developers aren’t familiar with JSON-LD or Schema.org, they can get up to speed quickly. If they’ve worked with other structured data formats — microformats or RDFa — they already know much about building JSON-LD.

Another benefit of JSON-LD is that it works with stores that use a dynamic backend to create web pages. JSON-LD is just data and is separated from the actual page. Thus, stores that use dynamic data can easily create a template for JSON-LD, too. You only need to take the time to create one JSON-LD product template and then reuse it across all product pages.

Example Product in JSON-LD

Consider this example of what a product page could look like in JSON-LD.

The Schema.org documentation describes all of the available fields. It is a valuable resource for setting up JSON-LD.

Here’s a representation of a product in JSON-LD that would show up on a product page.

 {
 "@context": "http://schema.org",
 "@type": "Product",
 "brand": {
 "@type": "Brand",
 "name": "Little Stream Software"
 },
 "sku": null,
 "description": "Sint rerum quis cupiditate maiores ratione inventore laudantium.",
 "url": "http:\/\/little-stream-software-dev.myshopify.com\/products\/durable-rubber-clock",
 "name": "Durable Rubber Clock",
 "image": "https://cdn.shopify.com/s/files/1/0843/1627/products/velautvelit_grande.png?v=1462423220",
 "itemCondition": "http://schema.org/UsedCondition",
 "offers": [{
 "@type": "Offer",
 "price": "39.00",
 "priceCurrency": "USD",
 "itemCondition": "http://schema.org/NewCondition",
 "url": "http:\/\/little-stream-software-dev.myshopify.com\/products\/durable-rubber-clock",
 "sku": null,
 "availability": "InStock"
 },{
 "@type": "Offer",
 "price": "23.93",
 "priceCurrency": "USD",
 "itemCondition": "http://schema.org/UsedCondition",
 "url": "http:\/\/little-stream-software-dev.myshopify.com\/products\/durable-rubber-clock",
 "sku": null,
 "availability": "InStock"
 }]
 }

Even without a technical background, you likely can read and understand some of this.

Notice the details about the Product.

  • name
  • description
  • brand
  • image
  • url
  • sku
  • condition (new or used)

Then there are details about the offer.

  • price
  • currency
  • condition (new or used)
  • availability

Easy to Update

All of this data combined helps search engines understand the product(s) for sale.

You’ll notice that some data in this example product is duplicated in both the Product (“@type”: “Product”,) and Offer (“@type”: “Offer”,) section.

In practice, the JSON-LD format allows you to list all of the details about your product, not just those in my example. In fact, when setting up JSON-LD, give search engines as much data as possible. You never know when they’ll use it in the search results.

Core Product Data

There are core, critical pieces of information to include in your Product JSON-LD.

  • name. This will typically appear as your organic listing title.
  • description. Parts of this will sometimes appear as your organic listing description.
  • itemCondition. New or a used.
  • availability. This can be shown as part of your organic listing. It’s important for popular products and can drive much traffic if you’re the only one in the search results showing that it’s in stock.
  • price. Combined with priceCurrency, this will appear in your rich snippets and can make price comparisons for shoppers easier.
  • priceCurrency. Such as U.S. dollars, Canadian dollars, Euros, and so on.
  • aggregateRating. If you have customer reviews, adding this data will provide more visibility in the listing. The orange stars, average rating, and number of reviews are all common things to see.
  • offers. You’ll need at least one Offer section but you should list every variant — sizes, colors, shapes — you have here. This can greatly increase your product’s surface area in search results.

In short, adding JSON-LD to your online store can help search engines parse your products and offers, and therefore greatly increase your organic search traffic. It’s not a shortcut or hack. Google and other search engines encourage it.

Eric Davis
Eric Davis
Bio


x