Schema Markup
Schema is code, added to your website’s html, that allows search engines to better understand what information is contained on the web page.
Schema Resources
Schema.org
https://schema.org/docs/gs.html is a good place to get started with schema, it outlines the different structures and syntaxes for schema markup. The properties are clickable links that will open to a new page showing further properties, if applicable, and expected values for the property. Careful, you can quickly end up way down the rabbit hole, with 20 open windows, and a red queen looking for your head!
Google Structured Data Testing Tool
https://search.google.com/structured-data/testing-tool is where you can test your schema, either by uploading your code snippets or by fetching a url. The result will show you the schema from the top level down, with expanding sub-sections, delineating errors and warnings. The warnings are often expected values that Google would like to see included with your markup. So if Google would like to see them, I recommend you put them in.
Advantages of Using Schema for Local Businesses
First and foremost, the advantage of using schema is to minimize ambiguity about:
- Who you are
- What you do
- Where you are
- Examples of your work
- Your business hours
- Your Service area
- What other places on the web can you be found i.e. “this is me on facebook”
- Adding reviews that are outside Google Reviews to your entity
- Having rich snippets show up in SERPs, like review star ratings or schedules
One theory is, if the search engine understands your website better, then you will rank higher in SERPs. Another theory is, if you get rich snippets in SERPs, you have more real estate on the page, and more information than the others on the page, thus, you are more likely to get a click.
What is JSON-LD?
Json-LD stands for javaScript Object Notation for Linking Data. It uses the schema.org vocabulary and sets the schema out in a groups of ordered pairs inside a context. The context is drawn from schema.org and looks something like this:
- “@context”: “http://schema.org”,
- “@type”: “LocalBusiness”,
- “name” : “ABC Company”
so what the above says is, “This webpage is using vocabulary from schema.org, specifically the vocabulary associated with LocalBusiness.” So the search engine instantly knows what you are talking about and what to expect — like “name” which in this case has a value of “ABC Company”
Using an “@id” Identifier
The other thing I want to cover in this post is the use of an identifier which sets an “id” for a group of linked data pairs that can be used as the value side of the data pair in a different context. This is best illustrated by example which I will cover later in this post.
Where to Put JSON-LD on Your Webpage
Unlike RFDa or Microdata, JSON-LD can be placed anywhere on the page, it does not have to wrap around the HTML on the webpage. JSON-LD is javaScript and can be placed between <script> tags. I use a plugin that allows me to code custom javaScript for a webpage inside WordPress to place the JSON-LD on the desired page, this makes life easy.
The Most Important Markup on Your Website
If you learn to do nothing else from this post, learn to do this: LocalBusiness markup. Below is an example of a LocalBusiness markup that collects all the important contact information for your business and outlines it in the data pairs.
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "LocalBusiness",
"url" : "https://www.abccompany.com",
"@id" : "#abcco",
"name": "ABC Company",
"description" : "A description of the company activity goes here",
"telephone" : "+1-905-555-1235",
"email" : "mail@abdcompany.com",
"address":
{
"@type": "PostalAddress",
"streetAddress": "810 Somewhere Drive",
"addressLocality": "Ville du Monte",
"addressRegion": "ON",
"postalCode": "L7Q 0X1"
},
"image" : "img/image-that-shows-in-rich-snippet.jpg",
"logo" : "img/abc-company-logo.png",
"priceRange" : "$1000 to $15000",
"areaServed":
{
"@type": "Country",
"name": "Canada"
}
}
</script>
Structure of JSON-LD
So let’s talk a bit about the structure of the markup. Most of the information is presented in an ordered pair of …
“property” : “value”,
and there is a comma after each pair except the last, showing “this is the end of the ordered pairs”. Some of the values are presented as a more specific “@type” of vocabulary presented inside another set of braces, as seen above by “address” : {…}. So we can see the address uses a more specific vocabulary of “@type” : “PostalAddress” which has its own set of ordered pairs.
I place this schema on every page of the website.
An Example of How to use @id Within a Schema Markup
Also, note that I have given this schema an @id using:
“@id” : “#abcco”
this will allow me to refer back to this schema within another set of schema without having to rewrite it. An example of this would be in a Service schema where you can define the provider of the Service as:
“provider”: {
“@id”:”#abcco”
}, ← Note that the comma comes after the braces
Listing What You Do – hasOfferCatalog
Whereas the schema above for LocalBusiness is “who you are” the hasOfferCatalog allows you to define “what you do”. For this we create an OfferCatalog and use an itemListElement What this allows you to define is all the Products or Services you provide with a url to the page where an explanation of those “offers” can be found. The markup looks like this:
{ "@context": "http://schema.org", "@type": "OfferCatalog", "name": "General Title for Company Services", "@id": "#abcco-offercatalog", "itemListElement": [ { "@type" : "ListItem", "name" : "Specific Service Offered", "Description" : "General description of this Service. ", "url" : "https://www.yourdomain.com/specific-service-page/" }, { "@type" : "ListItem", "name" : "Specific Service Offered #2", "Description" : "Specific description of Service #2. ", "url" : "https://www.yourdomain.com/specific-service-page-2/" } ] }
Implementing the hasOfferCatalog Schema
The code can be implemented in several ways.
- Add the markup to your existing LocalBusiness schema and place it on each page of your website
- Wrap the above code in <script> tags and link it to your LocalBusiness schema as shown below
- If you want you can place the OfferCatalog on one page and use a full url as the “@id”, like this
{
“@id”: “https://yourdomain.com/page-that-it-is-on#abcco-offercatalog”
}
- If you want you can place the OfferCatalog on one page and use a full url as the “@id”, like this
Linking your OfferCatalog to your business schema surfaces an additional benefit, that is, using differing OfferCatalogs with the same “@id” on different pages. This would be especially useful for category pages that contain several categories of the same type of product. I will discuss this below…
"hasOfferCatalog":
{
"@id" : "#abcco-offercatalog"
},
Using OfferCatalog on Category Pages
One advantage of the above code snippet is that you can place a different OfferCatalog on each category page, for category pages with several product types.
The example below shows a company selling industrial vacuum cleaners. They have a category page for Industrial Vacuum Cleaners but want to further subdivide the vacuums into several sub-categories — as opposed to listing all 20 vacuums on a single page. The sub-categories are as follows:
- intermittent duty vacuums
- continuous duty vacuums
- wet/dry vacuums
- explosion-proof vacuums
Each one of these sub-categories links to a page with 4 or 5 vacuums. On the main-category page each sub-category is used in the schema with a url pointing to the page where the sub-category is with those specific vacuums on it.
Review Schema
The Review you mark up on your website should be:
- Conceptually, thought of as reviews for your business, not necessarily for a service or product you provide.
- Be reviews you obtained outside of Google Reviews or another review site. These reviews should appear nowhere else on the internet.
The reviews you mark up can show up in the knowledge panel, for your business, in Search labelled as “Reviews from the Web”. Further, if you have a number of reviews and include an aggregateRating, these starts can show up in Search Listings under your webpage title.
An Example of Review Schema Markup
review is a property of LocalBusiness with an expected value of Review . I tend to tack this on the end of the LocalBusiness schema this because there tends to a group of reviews, so I enclose all of them in […] as shown below:
"review": [ { "@type": "Review", "author" : "Customer 1, "datePublished": "2012-03-10", "itemReviewed": { "@id" : "#abcco" }, "reviewBody": "These guys are great.", "reviewRating": { "@type": "Rating", "ratingValue": 5, "worstRating": 1, "bestRating": 5, "reviewAspect": "...above and beyond expectations" } }, { "@type": "Review", "author" : "Customer 2", "datePublished": "2014-04-15", "reviewBody": "Super Glowing Review I was so satisfied!", "itemReviewed": { "@id" : "#abcco" }, "reviewRating":
{ "@type": "Rating", "ratingValue": 5, "worstRating": 1, "bestRating": 5, "reviewAspect": "Working with ABC Co. was a pleasure..." } } ], "aggregateRating": { "@type": "AggregateRating", "ratingValue": "5", "reviewCount": "2" }
I have shown 2 Reviews within the [..] square brackets. Google likes to see an aggregate rating if you have more than 1 review, so I added that in at the bottom.
Last Word
There are many properties of LocalBusiness, OfferCatalog and Review that I have not used in the above examples. I recommend that you check out the links on this page to the specific schemas to see if there are properties that pertain to your business that you would like to include in your schema. After creating the schema markup in you favourite text editor paste it into the Google Structured Data Testing Tool and see what it returns – adjust and repeat!
Currently, I am doing a great deal of schema for my clients, even though schema markup is not considered a ranking factor, I have found the rankings for pages where I have added schema to, increase. It may be that the search engine better understands what is on the page or it may be that Google looks at a website that uses schema as having greater quality, I don’t know. It is a lot of work and there does seem to be rewards for it.
Great article. One quick question about the OfferCatalog type, however. When you stated that you could add this to the same LocalBusiness schema, how would this look? Would the code input be something like the following:
{
“@context”: “https://schema.org”,
“@type”: “LocalBusiness”,
….
“hasOfferCatalog” : { “@id”: “#testID” }
},
{
“@context”: “https://schema.org”,
“@type”: “OfferCatalog”,
“@id”: “#testID”,
….
}
or would the OfferCatalog be in a different file associated with the same page on the site?
Hi Darian, thanks for the comment.
Firstly, no I don’t think there should be a comma between the two types, each type stands alone.
If you put them on the same page, it looks good the way you have written it, except the comma I mentioned.
If you want to put the OfferCatalog on a different page then:
{
“@context”: “https://schema.org”,
“@type”: “LocalBusiness”,
….
“hasOfferCatalog” : { “@id”: “https://domainname.com/page-uri#testID” }
}
You can also do a list of OfferCatalogs like this:
{
“@context”: “https://schema.org”,
“@type”: “LocalBusiness”,
….
“hasOfferCatalog” : [
{ “@id”: “https://domainname.com/page1-uri#testID” },
{ “@id”: “https://domainname.com/page2-uri#testID” },
{ “@id”: “https://domainname.com/page3-uri#testID” }
]
}
The Google Schema markup tool is defunct but there is a Schema.org validator tool here: https://validator.schema.org/
Thank you because of you. i could add schema in my webpage