What is Microformat Markup?
How Microformats Work
<div>
, <span>
, and <abbr>
) combined with specific class names to define structured data. Unlike other structured data formats like JSON-LD or RDFa, microformats integrate directly into the HTML code.Common Uses of Microformats
- Contact information (
hCard
) - Events (
hEvent
) - Reviews and ratings (
hReview
) - Recipes
- Geographical locations
- Social networking profiles
Example of Microformat Markup
Here’s an example of how an event is marked up using the hEvent
microformat:
<div class="vevent"> <span class="summary">Web Development Conference</span> on <time class="dtstart" datetime="2025-06-15">June 15, 2025</time> at <span class="location">San Francisco, CA</span>. </div>
Advantages of Microformats
- Lightweight: Uses existing HTML elements and attributes, making it easy to implement.
- Semantic: Helps search engines and applications understand web content better.
- Human-readable: Unlike JSON-LD, which is hidden in
<script>
tags, microformats are visible in the page content.
Limitations of Microformats
- Limited flexibility: Can be harder to scale compared to JSON-LD.
- Not widely used anymore: JSON-LD has become the preferred format for structured data on the web.
When to Use Microformats Over JSON-LD or RDFa?
Microformats can be useful in specific scenarios, but they are generally less popular than JSON-LD and RDFa for structured data. Here’s when you might prefer Microformats over other options:
When You Want Human-Readable Data Embedded in HTML
Unlike JSON-LD, which is placed inside a <script>
tag and isn’t directly visible to users, Microformats integrate into the existing HTML structure. This makes them a good choice when:
✅ The structured data should be visible to users.
✅ You want a lightweight solution without adding extra scripts.
Example:
- A contact card (
hCard
) in the footer of a website. - An event listing (
hEvent
) directly in an article.
When You’re Working with Older Systems or Legacy Code
If you’re dealing with older websites or CMSs that don’t support JSON-LD or RDFa easily, Microformats can be a quick way to add structured data without significant modifications.
Example:
- If an old blog system doesn’t allow inserting JSON-LD
<script>
tags, Microformats can still add structured data within existing content.
When You Need a Quick, Lightweight Solution
Microformats are simple because they don’t require additional processing or JavaScript. If you want to add structured data without worrying about script execution, Microformats are a good choice.
Example:
- Small personal blogs where you don’t want to deal with extra markup complexity.
- Minimalist HTML pages that avoid external scripts for performance reasons.
When NOT to Use Microformats
If you want better SEO support, JSON-LD is the preferred format (Google recommends JSON-LD for structured data).
If you need more complex data relationships, RDFa or JSON-LD are better.
If you are working with Google Rich Results, JSON-LD is the best choice since it has wider support.
Also Read: Answer Engine Optimization (AEO): Beyond Traditional SEO
How to Implement Microformats on a Website
Microformats are easy to implement because they use standard HTML elements with specific class names to define structured data. Follow these steps to add Microformats to your website:
Choose the Right Microformat Type
There are different Microformats for different types of content. Some of the most common ones include:
- hCard → For people or organizations (like contact info)
- hEvent → For events (like conferences or meetups)
- hReview → For reviews (like product or movie reviews)
- hRecipe → For food recipes
You can find a full list at Microformats.org.
Add Microformat Markup to Your HTML
Microformats use specific class names to label structured data elements. Below are examples of different Microformat implementations.
Example 1: Adding a Contact Card (hCard)
<div class="vCard">
<span class="fn">John Doe</span>
<span class="org">Tech Company Inc.</span>
<span class="tel">+1 234-567-890</span>
<a class="email" href="mailto:johndoe@example.com">johndoe@example.com</a>
</div>
Example 3: Adding a Review (hreview)
<div class="hreview">
<span class="item">The Best Coffee Shop</span>
reviewed by <span class="reviewer">Alice Smith</span>,
rating: <span class="rating">4.5</span> out of 5.
</div>
How to Use Microformats on a WordPress Website
You can add Microformats to a WordPress site in different ways:
- Using a Microformats-compatible theme
- Manually adding Microformats in WordPress editor
- Using a plugin
Check If Your WordPress Theme Supports Microformats
Many older WordPress themes come with built-in Microformats support, especially those that follow semantic HTML best practices.
How to Check?
View your website source code (Right-click → View Page Source
)
Search for Microformats classes like vcard
, hentry
, hreview
, etc.
If your theme doesn’t support Microformats, you can manually add them or use a plugin.
Add Microformats Manually in WordPress (Classic Editor & Gutenberg)
If you want full control, you can manually insert Microformats into your content.
Method 1: Adding Microformats in the Classic Editor
1️⃣ Switch to Text Mode (not Visual mode).
2️⃣ Add the structured HTML with Microformats.
Example: Adding an Event (hEvent)
✅ Result: This adds structured event data directly into your post.
Method 2: Adding Microformats in Gutenberg (Block Editor)
If you’re using the Gutenberg block editor, follow these steps:
1️⃣ Add a Custom HTML block.
2️⃣ Paste your Microformats-enhanced HTML.
3️⃣ Click Preview to see how it looks.
Example: Adding a Review (hReview)
<div class="hreview">
<span class="item">Best WordPress Plugin</span>
reviewed by <span class="reviewer">John Doe</span>,
rating: <span class="rating">5</span> out of 5.
</div>
Leave a Reply