What is Schema?

Schema is a collaborative, community activity with a mission to create, maintain, and promote schemas for structured data on the Internet, on web pages, in email messages and beyond.

As above; Schema is an active, heavily sponsored markup to help developers and webmasters better prioritise data on websites, emails and beyond. I say heavily sponsored because it has backing from Google, Microsoft, Yahoo and Yandex (a major Russian search engine).

What do you mean prioritise data?

Well think of it this way: up until Schema it was entirely the search engine that decided what was important on a page. It had to try and guess what type of content an HTML element had inside of it. For example, say you have an ecommerce store and on the product page you have the product title, inventory and price. Without marking up the code using Schema, it would entirely be at the search engines discretion as to what each part was (search engines are smart but not foolproof!). Schema offers a way for developers and webmasters to help out the search engine by grouping information together and letting it know the context that it serves. So going back to our ecommerce example, you can now manually tell Google what HTML element contains the price, inventory etc.

So what will Schema do for me?

Other than helping search engines crawl your sites data there are a number of benefits that you will love.

Rich Snippets

You may have started noticing a little while ago that sub-data is shown in the search results. Screen Shot 2016-02-16 at 14.44.54 The example above, for a client of ours Skinmaze, shows the ratings and the price of the product, because we’ve marked up the product pages carefully using Schema. This isn’t just for ecommerce sites though, it works for a number of things. You could use it for:

  • Events – drawing attention to start / end dates, times and price with Schema
  • Recipes – highlighting prep times, total times, ingredients etc
  • …and a whole bunch of other data types.

Want to learn the rest? Take a quick look here (but promise you’ll come back).

Using Google Knowledge Graph for your local business

So moving on slightly. One of Google’s biggest features right now is their Knowledge Graph. You may have noticed when you search for certain things on Google, info boxes like this one are returned. This one appears when you search “what is scheme seo”. You’ve probably noticed it when you search celebrities too. knowledge-graph-example Where Google Knowledge Graph can benefit you though, is that it lets you outline your business. By adding the local business Schema markup to your site, you can tell the search engine all about you, your opening times, alternative names, location, contact details and the best part is that Google will highlight you when someone in your local area searches for you by name making it so much easier for customers to find you. Here’s how that looks when you search “authentic style” on Google. local-business-schema

You’ve outlined how Schema is good for the end use but how will that help my SEO Ranking?

Remember, Google is smart. It wants to make sure that the sites that people go to through their search engines are useable and contain the information they are looking for. Recently Google even started to rank sites that were mobile friendly better than those that aren’t. They even have an algorithm that makes sure that the content on the page is readable.

Ultimately by adopting Schema you are making yourself look more user friendly to the search engines, which is a win for all parties involved.

 Let’s look at the code and implement something

There are a number of ways to implement Schema. However our preference here at Authentic Style is with the Microdata method.


We think this is the best method, because it allows us to quickly and easily implement Schema while coding, The Microdata method is simply HTML attributes that you add to elements on the page to specify what they are. In these examples, I’ll mark up parts of a product page on an ecommerce site. [jsfiddle url=”https://jsfiddle.net/pfnu097w/” width=’100%’ height=”450px” include=”html”]


Like Microdata this is written within the HTML of the page and it uses the same attributes, but calls them slightly differently. While using RDFa you only need to set the src for the Schema once (e.g. vocab attribute on the top level element in the example below). Once that is set then the search engine knows which structured data method you are using – in this case Schema. [jsfiddle url=”https://jsfiddle.net/pfnu097w/1/” height=”450px” include=”html”]


The last method for coding in Schema is through JSON and unlike the other methods it can be added anywhere in your page. [jsfiddle url=”https://jsfiddle.net/pfnu097w/4/” height=”450px” include=”html”]

I’m no good at this code malarky. Do I have to fork out for a developer?

Nope Google’s got you covered! All you need is a Google Account and to be signed up to Google Search Console (formerly Webmaster Tools). Once you have an account and have followed the instructions to verify that you own the website you are trying to add Schema to, you can access the Markup Highlighter. The markup highlighter is ridiculously simple.

  • Just make sure you are logged in to your Google account and have verified your website
  • Launch the tool
  • Enter the URL to the page you would like to add the Schema to
  • Select which type of Schema to add and then highlight the sections and specify what it is

It really is that simple.

Let’s create something
great together.

All great things start with a chat. Use the adjacent form or our project planner to get things started.

Project Planner

We’re currently accepting projects
Please enable JavaScript in your browser to complete this form.

Authentic Insights