Frequently Used Schema.org Examples and How They Work

Schema markup allows for the categorization of data structures on your website, helping search engines analyze your content more effectively and enhancing its presentation in search results. This can increase your site’s visibility, making it more engaging, interactive, and ultimately beneficial for your SEO efforts.

How it Works

Schema.org primarily uses three HTML tag attributes: itemscope, itemtype, and itemprop. Let’s look at each of them one by one.

To make it easier to understand, I’ll provide a small example. Let’s create markup for a block that contains information about “The Grand Budapest Hotel” movie.

<!-- Movie -->
<div>
	<!-- Name -->
	<h1>The Grand Budapest Hotel</h1>

	<!-- Director -->
	<div>
		Director: <span>Wes Anderson</span>
	</div>

	<!-- Genre -->
	<span>Comedy drama</span>

	<!-- Trailer link -->
	<a href="...">Trailer</a>
</div>

itemscope

The itemscope attribute is represented by an attribute that has no value. It indicates that this item (and its content) will contain structured data about some type of object within it. Which one? That will be clear from the next tag.

itemtype

The itemtype attribute specifies what type of object we are describing within an item with the itemscope attribute. In its value, you must specify a link to the official documentation page that describes the type of object. In our example, it will be https://schema.org/Movie.

<!-- Movie -->
<div itemscope itemtype="https://schema.org/Movie">
	...

itemprop

The itemprop tag specifies the type of property that will be applied to the nearest parent item with the itemscope + itemtype tag. The property type is also set by the value of this attribute with a link to the documentation page, similar to itemtype. The value of this property is set by the content inside this HTML tag.

Here’s how our example with the applied markup would look:

<!-- Movie -->
<div itemscope itemtype="https://schema.org/Movie">
	<!-- Name -->
	<h1 itemprop="name">The Grand Budapest Hotel</h1>

	<!-- Director -->
	<div itemprop="director">
		Director: <span>Wes Anderson</span>
	</div>

	<!-- Genre -->
	<span itemprop="genre">Comedy drama</span>

	<!-- Trailer link -->
	<a href="..." itemprop="trailer">Trailer</a>
</div>

Embedded items

You can also use nested elements by simply combining all the attributes in one tag:

<!-- Movie -->
<div itemscope itemtype="https://schema.org/Movie">	
	...

	<!-- Director -->
	<div itemprop="director" itemscope itemtype="https://schema.org/Person">
		Director: <span itemprop="name">Wes Anderson</span>
	</div>

	...

Examples

Here are some examples of the frequently used schemas that can be found on nearly every website. You can also use the official markup validator to validate your implementations.

Breadcrumbs

<!-- Breadcrumbs -->
<ul itemscope itemtype="https://schema.org/BreadcrumbList">
	<!-- Item -->
	<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
		<a href="..." itemprop="item">
			<span itemprop="name">Home</span>
		</a>
		<meta itemprop="position" content="1">
	</li>
	
	<!-- Item -->
	<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
		<a href="..." itemprop="item">
			<span itemprop="name">Page</span>
		</a>
		<meta itemprop="position" content="2">
	</li>
</ul>

Article

<!-- Article. Can be (Article, NewsArticle, BlogPosting) -->
<article itemscope itemtype="https://schema.org/NewsArticle">
	<!-- Title -->
	<h1 itemprop="headline">Post Title</h1>

	<!-- Thumbnail -->
	<img itemprop="image" src="https://example.com/photos/16x9/photo.jpg">
	<meta itemprop="image" content="https://example.com/photos/1x1/photo.jpg">
	<meta itemprop="image" content="https://example.com/photos/4x3/photo.jpg">

	<!-- Content -->
	<div itemprop="articleBody">
		<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Mollitia, corrupti.</p>
		<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Amet perferendis, fugiat id esse eius illo.</p>
	</div>

	<!-- Dates -->
	<div>
		<div>
			<span>Posted:</span>
			<span itemprop="datePublished" content="2024-01-05T08:00:00+08:00">January 5, 2024 at 8:00 AM</span>
		</div>

		<div>
			<span>Last modified:</span>
			<span itemprop="dateModified" content="2024-02-05T09:20:00+08:00">February 5, 2024 at 9:20 AM</span>
		</div>
	</div>

	<!-- Author -->
	<div itemprop="author" itemscope itemtype="https://schema.org/Person">
		<span>Author</span>
		<span>
			<a itemprop="url" href="https://yanmet.com/">
				<span itemprop="name">Yan Meteitsa</span>
			</a>
		</span>
	</div>
</article>

Service

<!-- Service -->
<section itemscope itemtype="https://schema.org/Service">
	<h3 itemprop="serviceType">Landing Development</h3>
	<meta itemprop="provider" content="YANMET Studio">

	<div itemprop="description">
		<p>We provide full-cycle web development services, including design, development, and SEO optimization.</p>
	</div>
</section>

Product

<!-- Product -->
<div itemscope  itemtype="https://schema.org/Product">
	<!-- Main Data -->
	<h1 itemprop="name">Dell Precision 7730<h1>
	<img src="https://yanmet.com/dell-7730.jpg" itemprop="image">
	<meta itemprop="sku" content="dell-7730">
	
	<!-- Brand -->
	<div itemprop="brand" itemscope itemtype="https://schema.org/Brand">
		<meta itemprop="name" content="Dell">
	</div>

	<!-- Description -->
	<div itemprop="description">
		<p>The Precision 7730 justifies its high price with powerful overall performance and a gorgeous 4K display in a durable, attractive chassis.</p>
	<div>

	<!-- Offer -->
	<div itemprop="offers" itemscope itemtype="https://schema.org/AggregateOffer">
		<meta itemprop="offerCount" content="16">
		<meta itemprop="lowPrice" content="2200.00">
		<meta itemprop="highPrice" content="4850.00">
		<meta itemprop="priceCurrency" content="USD">
	</div>
</div>

Offer section for non-variable products:

<div itemprop="offers" itemscope itemtype="https://schema.org/Offer">
	<meta itemprop="price" content="2200.00">
	<meta itemprop="priceCurrency" content="USD">
</div>

FAQ

<!-- FAQ Section -->
<section itemscope itemtype="https://schema.org/FAQPage">
	<h1>FAQ</h1>

	<!-- Item -->
	<details itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
		<!-- Question -->
		<summary itemprop="name">If you were a dog, which breed would you want to be?</summary>

		<!-- Answer -->
		<div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
			<div itemprop="text">
				<p>Definitely a pug.</p>
			</div>
		</div>
	</details>
</section>

Organization

<!-- Organization / About -->
<section itemscope itemtype="https://schema.org/Organization">
	<!-- Info -->
	<div>
		<h2 itemprop="name">YANMET LLC</h2>
		<img src="https://yanmet.com/logo.png" alt="YANMET ogo" width="48" height="48" itemprop="logo">

		<p itemprop="description">Comprehensive website development from scratch.</p>

		<a itemprop="url" href="https://yanmet.com">
			<span>Visit Website</span>
		</a>
	</div>
  
	<!-- Address -->
	<div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
		<span itemprop="streetAddress">123 Web Developer Street</span>
		<span itemprop="addressLocality">Denver</span>
		<span itemprop="addressRegion">My Region</span>
		<span itemprop="postalCode">123456</span>
		<span itemprop="addressCountry">Belarus</span>
	</div>

	<!-- Contacts -->
	<div>
		<a href="mailto:mail@yanmet.com" itemprop="email">
			<span>mail@yanmet.com</span>
		</a>

		<a href="tel:+123 456-78-90" itemprop="telephone">
			<span>+123 456-78-90</span>
		</a>
	</div>
</section>

Review

<!-- Review -->
<div itemscope itemtype="https://schema.org/Review">
	<!-- Author -->
	<h3 itemprop="author">John Doe</h3>

	<!-- Rating -->
	<div itemprop="reviewRating" itemscope itemtype="https://schema.org/Rating">
		<span itemprop="ratingValue">4</span>
		/
		<span itemprop="bestRating">5</span>
	</div>

	<!-- Content -->
	<p itemprop="reviewBody">Excellent service and fast delivery!</p>
</div>

Additional Resources

• Introduction to structured data markup in Google Search