HTML Microdata

HTML Microdata is a way to add structured data to web pages using special attributes like itemscope, itemtype, and itemprop. It helps search engines understand content better and improves SEO by enabling rich results like reviews, products, and events in search listings.

3 views
5 min read
Try It Yourself

Experiment with the code in an interactive editor

What is Microdata? (Structured data for search engines)

Microdata helps Google understand your content better. It can show "rich snippets" (star ratings, prices, event dates) in search results.

What is

A library of agreed-upon types (Person, Product, Recipe, etc.) that all search engines understand.

Basic Microdata Example:

1<!-- Without microdata: Google just sees text -->
2<div>
3    <h1>Deepak Verma</h1>
4    <p>Full Stack Web Developer</p>
5    <p>Lucknow, India</p>
6</div>
7
8<!-- With microdata: Google understands it's a Person -->
9<div itemscope itemtype="https://schema.org/Person">
10    <h1 itemprop="name">Deepak Verma</h1>
11    <p itemprop="jobTitle">Full Stack Web Developer</p>
12    <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
13        <span itemprop="addressLocality">Mumbai</span>,
14        <span itemprop="addressCountry">India</span>
15    </div>
16    <a itemprop="url" href="https://deepakverma.com">Portfolio</a>
17</div>

Common Schema Types:

1<!-- Person -->
2<div itemscope itemtype="https://schema.org/Person">
3    <h1 itemprop="name">John Doe</h1>
4    <p itemprop="jobTitle">Software Engineer</p>
5    <p itemprop="email">john@example.com</p>
6</div>
7
8<!-- Organization -->
9<div itemscope itemtype="https://schema.org/Organization">
10    <h1 itemprop="name">Google</h1>
11    <p itemprop="description">Search engine and technology company</p>
12    <p itemprop="address">Mountain View, California</p>
13</div>
14
15<!-- Product -->
16<div itemscope itemtype="https://schema.org/Product">
17    <h1 itemprop="name">iPhone 15</h1>
18    <p itemprop="description">Latest smartphone from Apple</p>
19    <span itemprop="price">$999</span>
20    <span itemprop="priceCurrency">USD</span>
21    <div itemprop="offers" itemscope itemtype="https://schema.org/Offer">
22        <span itemprop="availability">In stock</span>
23    </div>
24</div>
25
26<!-- Review -->
27<div itemscope itemtype="https://schema.org/Review">
28    <span itemprop="reviewRating">5 stars</span>
29    <p itemprop="reviewBody">Excellent product! Very happy with my purchase.</p>
30    <span itemprop="author">Deepak Verma</span>
31    <time itemprop="datePublished" datetime="2026-04-07">April 7, 2026</time>
32</div>
33
34<!-- Recipe -->
35<div itemscope itemtype="https://schema.org/Recipe">
36    <h1 itemprop="name">Chicken Curry</h1>
37    <p itemprop="cookTime">30 minutes</p>
38    <p itemprop="recipeYield">4 servings</p>
39    <div itemprop="recipeIngredient">Chicken - 500g</div>
40    <div itemprop="recipeIngredient">Spices - as needed</div>
41    <div itemprop="recipeInstructions">Cook chicken with spices for 30 minutes</div>
42</div>
43
44<!-- Event -->
45<div itemscope itemtype="https://schema.org/Event">
46    <h1 itemprop="name">Tech Conference 2026</h1>
47    <p itemprop="startDate">2026-04-15</p>
48    <p itemprop="location">Mumbai, India</p>
49    <p itemprop="description">Annual technology conference</p>
50</div>

Why Microdata Matters for SEO:

Without Microdata

With Microdata

Just text in search results

Rich snippets with images, ratings, prices

Lower click-through rate

Higher click-through rate (up to 30% more clicks)

No special formatting

Stars, prices, event dates, images in results

Example of rich snippet in Google:

⭐ 4.8 (1,234 reviews)iPhone 15 - $999Latest smartphone from Apple with A17 chip