Microformats provide a way to add semantic meaning and structured data directly to HTML. This markup allows search engines, social media tools, and aggregators to understand the entities on a page, such as people, events, or blog posts. By using simple HTML classes, you transform plain text into a machine-readable API for your website.
What are Microformats?
Microformats are a set of simple, open data formats built on existing standards like HTML and XHTML. Unlike complex data methods, they use standard HTML attributes like class and rel to designate information types. They are designed for "humans first and machines second," meaning the data remains readable by users in a browser while software agents process the underlying metadata reliably.
The movement began as a grassroots effort to make data items like contact details or geographical locations capable of automated processing. [Microformats emerged around 2005] (Wikipedia) to bridge the gap between human-readable content and machine-understandable data.
Why Microformats matter
Using microformats offers several advantages for SEO and site interoperability:
- Improved Search Results: Search engines interpret this data to provide more relevant results. [Google announced in May 2009 that it would parse hCard, hReview, and hProduct] (Google Search Central) to populate search result pages.
- Rich Snippets: Structured data enables search engines to display special snippets, such as star ratings or event dates, directly on the search results page.
- Interoperability: Standards like the Webmention spec use microformats to send messages, comments, and social reactions (likes, reposts) between different websites.
- Longevity: Even as new standards emerge, search engines continue to support these formats. [Google confirmed in 2020 that it still parses microformats for use in content indexing] (Microformats.org).
- Data Portability: Browser extensions and tools can detect this data, allowing users to export contact information directly to address books or events to calendars.
How Microformats work
Microformats work by applying specific class names to HTML elements. When a parser encounters these classes, it recognizes a "root" entity and its associated "properties."
Modern implementations use Microformats 2 (mf2), which introduced a simplified prefix system. [Microformats2 was discussed and proposed in May 2010] (Microformats.org) to make publishing and consuming data easier.
Common Prefixes
- h-* (Root): Defines the object type, such as
h-cardfor a person orh-entryfor a post. - p-* (Plain text): Used for properties like
p-nameorp-summary. - u-* (URL): Used for properties involving links or images, such as
u-urloru-photo. - dt-* (Datetime): Used for date stamped information like
dt-published. - e-* (Element tree): Used when the property value is the entire contained HTML hierarchy, like
e-content.
Common types of Microformats
h-card
This format represents a person or organization. It is the microformat equivalent of a vCard.
* Properties: p-name, u-email, u-photo, p-locality, p-country-name.
h-entry
Used for episodic or date-stamped content, primarily blog posts and notes.
* Properties: p-name (title), p-author, dt-published, e-content.
h-event
Used for marking up event listings and individual event pages.
* Properties: p-name, dt-start, dt-end, p-location.
rel-property formats
These describe relations between the current page and a linked document:
* rel="author": Identifies the author of the page.
* rel="license": Points to the copyright license.
* rel="nofollow": Instructs search engines not to give weight to the link.
Best practices
Use the effective URL. When parsing, always resolve relative URLs against the final "effective URL" after all redirects, rather than the starting URL.
Prioritize plaintext where possible. To avoid security risks, use a function to extract the first plaintext value from a property. Only use embedded HTML (e-) properties when it is necessary to preserve markup.
Validate your URLs. Everywhere you expect a URL property, verify that the output is a valid link. If using the URL as an image, consider checking its content type.
Search the entire tree. Never assume the data you need is at the top level of the JSON output. Use functions that traverse the entire tree to find nested structures.
Sanitize all inputs. Parsers do not prevent XSS attacks. You must pass any parsed HTML through a purifier to ensure it cannot interfere with your site's security or layout.
Common mistakes
Mistake: Assuming a property value is always a plain string.
Fix: Prepare your code to handle embedded HTML structs or image/alt structs by checking for html or alt keys.
Mistake: Skipping the base URL. Fix: Provide the parser with the base URL of the page so it can correctly resolve relative images and links.
Mistake: Ignoring non-200 HTTP responses.
Fix: Check responses like 410 Gone, which may still contain an h-entry explaining why content was deleted.
Mistake: Using the abbr design pattern for dates.
Fix: Avoid hiding machine-readable dates in the title attribute of an <abbr> tag. This causes accessibility issues for screen readers. Use the time element with a datetime attribute instead.
Microformats vs. Microdata
| Feature | Microformats | Microdata |
|---|---|---|
| Goal | Simplest way to provide a read-only API | Flexible embedding of arbitrary vocabularies |
| Syntax | Uses standard class attributes |
Uses specific itemprop and itemtype attributes |
| Complexity | Low: leverages existing CSS habits | Moderate: requires learning a new attribute set |
| Extensibility | Fixed vocabularies (mf2 is more flexible) | Infinitely extensible |
FAQ
Do major search engines still support microformats? Yes. Google, Bing, and Yahoo have supported microformats for over a decade. Google specifically confirmed its continued use of the format for content indexing as recently as 2020. It is often used as a fallback or alternative to Schema.org.
Are microformats an API? Effectively, yes. By combining HTTP and microformats, your website becomes its own read-only API. You do not need to maintain separate JSON or XML files to provide structured data to third-party tools.
Which version should I use? You should use Microformats 2 (mf2). It is the current stable version and is designed to be backwards compatible with "classic" microformats, while being much easier for developers to parse.
How do I handle multiple values for a single property? Every property in a microformat can have multiple values. If your application only needs one (like a name), the standard practice is to take the first instance found. If you need a canonical URL among many, use the first one and treat others as external profiles.
What is the difference between p-, u-, and dt- prefixes?
These prefixes tell the parser how to find the data. p- takes the text inside an element. u- looks at attributes like href or src. dt- specifically looks for date and time values, often within a datetime attribute.
