Schema Markup for Dummies: An MRS Guide 2018

Schema markup is one of the most under-utilised SEO techniques out there. This is surprising, because it is one of the most valuable and powerful tools available to search engine marketers in 2018. So, why are people missing out? Well, check out this introduction to schema markup on Schema.org:

Schema.org vocabulary can be used with many different encodings, including RDFa, Microdata and JSON-LD. These vocabularies cover entities, relationships between entities and actions, and can easily be extended through a well-documented extension model.

Over 10 million sites use Schema.org to markup their web pages and email messages. Many applications from Google, Microsoft, Pinterest, Yandex and others already use these vocabularies to power rich, extensible experiences”

– https://schema.org/

Not exactly crystal clear is it? This means many feel out of their depth before they’ve even started.

Encodings…entities…what on earth is JSON-LD?

We hear you. Unless you’re a developer, it can sound a bit complicated. If you’re not, no fear. MRS’s handy guide to schema markup will show you the way.

What is Schema Markup?

Schema markup is code you put onto your website to add context to its content for non-human readers (i.e. Google). It gives Google information in a consistent way that is easier for it to process, which in turn allows Google to serve this content to its users in search results. Here’s an example:

This is the first result when you search for ‘cupcake recipe’ in the UK. Unlike normal Google results, you have been returned an enhanced snippet; a result with an image of the cupcakes, a star rating, baking time and calories – in addition to a description!

This is schema in use. Google has read BBC Good Food’s markup and understands the information provided is a recipe, structuring all its information in the correct areas. Without schema, Google can only read the semantics, i.e. ‘recipe’, ‘cupcake’ to understand the context of a page, and will not show any additional information like calories/star rating/time to bake. This means a recipe blog without schema will be favoured far less over those that provide search engines with useful information.

Schema Types

In addition to recipe schema markup, there are many hundreds of schema markup options, however some of the most commonly used examples include:

Organisation & local business schema

Organisation and local business schema is a staple schema markup that every business should have implemented on their site. This schema includes markup for your business’s location, images, exact coordinates, contact information, social links and reams of extra information including ratings and amenities – e.g. Free WiFi (if applicable).

An example of a local business snippet and a hotel snippet:

Event schema markup

For websites that organise events, event schema markup allows clickable listings of upcoming events in the snippet:

Ecommerce: products & offer markup

For websites that sell products, product schema offers up clear, helpful information regarding prices, stock levels, product reviews and deals on particular products.

Article markup

Publishing websites can make use of schema article markup to help content appear in Google’s newsfeed with a headline, an image and the date and length of time since it was published.

What does schema markup look like?

To someone not familiar with code, it can look a little daunting. But, to Google itis crystal clear, easy to read information. Below is an example of local business schema (in JSON), with some core details correctly filled out. This makes it far easier for Google to understand than having to read your website footer for an address or seek out where a contact email sits on your site:

  
    {
      "@context": "http://schema.org/",
      "@type": "LocalBusiness",
      "url": "https://mrs.digital/",
      "name": "MRS Digital",
      "address": {
        "@type": "PostalAddress",
        "addressLocality": "Redfields Lane, Church Crookham",
        "addressRegion": "Fleet",
        "postalCode": "GU52 0RJ",
        "streetAddress": "1 Blue Prior Business Park",
        "addressCountry": {
          "@type": "Country",
          "name": "United Kingdom"
        }
      },
      "telephone": "01252622722",
      "logo": "https://mrs.digital/assets/img/logo.png",
      "sameAs": [
        "https://www.facebook.com/MRSDigitalAgency",
        "https://plus.google.com/111541337070256848007",
        "https://uk.linkedin.com/company/mrs-digital",
        "https://twitter.com/MRSDigital"
      ],
      "email": "shout@mrs.digital",
      "aggregateRating": {
        "@type": "AggregateRating",
       "ratingValue": "4.8",
        "reviewCount": "21"
      },
      "image": "https://lh5.googleusercontent.com/p/AF1QipOrRJgMdkQ2phkunUd7Ers41Z6dc-KNGLdejWdw=w203-h203-k-no",
      "contactPoint": [
        {
          "@type": "ContactPoint",
          "telephone": "+441252622722",
          "contactType": "sales",
          "areaServed": [
            "GB"
          ]
        }
      ]
    }
  

Fortunately, you don’t need to be able to write this code out from scratch, though it will certainly benefit you if you have an understanding of elements of it.

Schema Markup Format

Supported formats for Schema Markup are JSON-LD, Microdata and RDFa. Microdata and RDFa must be implemented onto your website via a developer. JSON-LD is the current recommended format for which we will be using as an example in this guide. It is recommended because unlike Microdata and RDFa, a Developer is not needed to implement the code, you can. We’ll touch on this in the next section.

Where and how to add Schema Markup

Now you have a clearer understanding of what schema markup is and how it works, you can begin to create your own. The easiest way to do this is when you’re starting out is to copy and paste markup provided by Google, then amend and build on as necessary. Here are a few examples of the templates Google provide:

Local Business

Product

Article

Recipe

Using these markups you can then update the information with the relevant details from your business or website. You can also look up any areas you aren’t sure about on Schema.orgtosupplement.

Once you have filled out your markup, you should next test it using Google’s Structured Data Tool. This highlights any errors in the code for you to amend so you know the markup you are putting onto your site is correct.

Tip: Fixing Structured Data Errors

If you drop your JSON mark-up in Google’s Structured Data Testing Tool and you get an error, it will almost always be due to missing one of three characters; ‘,’ or ‘]’ or ‘}’.

Commas:

Used for listed items in your markup. Remember; the last item in any list does not need a comma.

Braces (wiggly brackets):

Wrap lists of properties. If you’re ending or beginning a list there should be a wiggly bracket. Your whole schema mark-up should be wrapped in wiggly brackets and so should nested lists of properties such as the separate parts that make up an address.

Square brackets:

Used to wrap lists of values. So, for example, if you’re listing different days of the week you’re open then these need to be wrapped in square brackets.

If you’re not used to it, JSON can look complex and be fiddly at first, but bear with it and you’ll get it in no time!

Upload your code

Your code can now either be uploaded directly into the HTML of your site by a developer, or, if you are using JSON, via Google Tag Manager. With Tag Manager, you can inject the schema code in directly, without the need for a developer.

If you don’t currently have a Google Tag Manager Account, you will need a developer for the initial set up. Google Tag Manager is brilliant, though, especially if you use Google Analytics a lot – we would recommend trying it.

Assuming you have access to Tag Manager, here is the process of injecting simple organisation or local business schema to all pages of your site:

1) After testing your markup, copy your code.

2) In Tag Manager, click ‘New Tag’

3) Set Tag Configuration to ‘Custom HTML’ and paste in your code

4) Set Trigger to ‘All Pages’

5) Save your Tag and publish your changes by clicking ‘submit’ in the top right.

6) Check your markup works by putting your website address into Google’s Structured Data Testing Tool

Implementing Schema for Products/Recipes and other individual pages

For schema on individual pages such as products or reviews, it can start to get a bit complex. You will need to follow further steps or speak to your Developer to show you the ropes the first time.

Want to enhance your SEO Further?

Schema is just one small piece of the puzzle when it comes to SEO. If you need further help, speak to one of our experts today.

Did we hit the mark?


Share Now