Close

February 11, 2016

Schema Tags: Use Structured Data To Talk To Search Engines

Imagine…

…if one day all the search engines got together and agreed on how things should be labeled on a website. Well, that day has come and gone, yet no one knows about it! Google, Microsoft, Yahoo and Yandex created Schema Tags, one of the least used, yet most powerful, SEO modifications you can make to your website.

What are Schema Tags?

Schema Tags allow you to tell search engines what your content actually is, not just what it is. Ok, that’s not helpful. Lets take an ecommerce item for example. When the search engines scan your site, they see that “$19.00” exists and that “Awesome Doohickey” exists, but it doesn’t know that $19.00 is the price and Awesome Doohickey is the item’s name. Schema tags are the solution to this very simple problem.

Is it just for ecommerce?

Nope, its for all kinds of common web items. Here’s a short list:

  • Creative works (books, movies, recipes)
  • Embedded non-text objects (audio and image objects)
  • Events
  • Organizations
  • People
  • Places
  • Local Businesses
  • Restaurants
  • Products
  • Offers
  • Actions

How do you use them?

Now here’s the hard part. You might need a developer to implement these on your site, which may be why you don’t see Schema tags implemented as often as they should be.

Get started

Have your developer go to Schema.org and read the necessary documentation.

Just kidding, I’ll show you the basics so you can make sure your developer sets the tags up right.

How should the tags be set up?

The tags are easy to understand if someone takes the time to explain them. First wrap your content in a tag that declares what kind of data it is. In the below case, we are saying this is a product item. The “ItemList” declares this. Each of the items in the list has a special name.

[code lang=”html”]
<div itemtype="http://schema.org/ItemList">
All my item attributes will be in this space like price, name, picture etc.
</div>
[/code]

Next, we get to the meat of the schema. We need to wrap every element of our product in schema tags. If there isn’t an html element already surrounding the item, you can add span tags to wrap the element. See example below of a full snippet from Schema.org:

[code lang=”html”]
<div itemtype="http://schema.org/ItemList">
<link itemprop="url" href="http://multivarki.ru?filters%5Bprice%5D%5BLTE%5D=39600" />
<span itemprop="numberOfItems">315</span>
<div itemprop="itemListElement" itemscope=" itemtype="http://schema.org/Product">
<img alt="Photo of product" itemprop="image"
src="http://img01.multivarki.ru.ru/c9/f1/a5fe6642-18d0-47ad-b038-6fca20f1c923.jpeg" />
<a itemprop="url" href="http://multivarki.ru/brand_502/">
<span itemprop="name">BRAND 502</span>
</a>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="price">4399 р.</span>
</div>…
<div itemprop="itemListElement" itemtype="http://schema.org/Product">

</div>
</div>
</div>
[/code]

Notice how itemprop=”price” and itemprop=”name” are in the code, telling the search engines what your content is. Success!

How about a cool tool? Because this should be easy…

Now if the code above is a little confusing, don’t worry. Google wrote an amazing, amazing, amazing application to help you choose what to be “tagged” and then sends the code to your developer.

Go to https://www.google.com/webmasters/markup-helper/. You might have to create a Webmasters account with Google first. Select the type of item you want to “Schema” and enter the url of a page that has this information. Google will let you literally click items on the page and choose what they are related to. When you are done, click “view HTML” and see your page with Schema tags. You have to see it to believe it.

Leave a Reply

Your email address will not be published. Required fields are marked *