JSON-LD and meta tags

Question

I am working with my client's website and trying to figure out why, and how to use rich snippets. Something that is confusing me is how these snippets work together with the meta tags.

Let's say I have the following meta tags, and this JSON-LD snippet:

<title>Beachwalk Beachwear & Giftware</title>
<meta name="description" content="Cloths for sale." />
<h1>Cheap cloths for sale</h1>

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "LocalBusiness",
  "address": {
    "@type": "PostalAddress",
    "addressLocality": "Mexico Beach",
    "addressRegion": "FL",
    "streetAddress": "3102 Highway 98"
  },
  "description": "A superb collection of fine gifts and clothing.",
  "name": "Beachwalk Beachwear & Giftware",
  "telephone": "850-648-4200"
}
</script>

What is the point to use these snippets, if I am already using the meta tags? And should I use the same snippets on every single page with the same attributes? For example the same opening hours, email and telephone?

Or is the snippet description just a short summary of the page? And same with the name, should it be the same as the h1?

Answer 1

Plain HTML link/meta/title elements in the head element always apply to the whole document:

• In a page about an organization, the title element gives the title of the web page, not the name of the organization (it contains the name, but it typically contains additional content).

• In a gallery page, the meta-description element gives the description of the gallery, not of all the images it contains.

But what if you want to say something about an entity described in this document (e.g., give the organization’s name, give information about each image in the gallery)?

JSON-LD can help here, in combination with a vocabulary like Schema.org. It allows you to provide structured data not only about the web page, but also about entities described in this page. For example, I can say that a web page is published by organization A, and contains content about a different organization B:

<script type="application/ld+json">
{
  "@context": "http://schema.org",

  "@type": "WebPage",

  "publisher": {
    "@type": "Organization",
    "name": "A"
  },

  "mainEntity": {
    "@type": "Organization",
    "name": "B"
  }

}
</script>

Alternatives to JSON-LD are Microdata and RDFa. Instead of providing the data in a script element (thereby duplicating it), they use your existing HTML markup. See an overview and examples here.