Skip to content

Schema.org Microdata

Richard Hand edited this page Apr 4, 2019 · 7 revisions

Where relevant, component markup should be annotated with Schema.org vocabulary to improve the way the component is represented in Search Engine Results Pages (SERPs). Schema.org is recognized by all major search engines.

Example

The Image Component uses Schema.org vocabulary. It produces a markup similar to the below:

<div itemscope="" itemtype="http://schema.org/ImageObject">
  <img src="rio.jpg" itemprop="contentUrl" alt="Sunset at Rio De Janeiro airport" title="Finally landed in Brazil">
  <meta itemprop="caption" content="First day in Brazil">
</div>

Resulting in the following Schema:

  • @type ImageObject
  • contentUrl https://mysite.com/rio.jpg
  • caption First day in Brazil!

When to use Schema.org Microdata

For most components, there won't be a schema suitable for the markup that is produced. Common uses cases include creative works, events, people and places.

For new components, check the Schema.org schemas for a suitable schema.

For components already using a schema, check if there are any suitable additional properties - ImageObject for the Image Component example.

Verifying Microdata

The Google Structured Data Testing Tool is a great tool for verifying the microdata from a markup snippet or page URL.