HTML 微格式 Microformats
HTML微格式：h-card人物卡片、h-event事件、h-product产品、结构化数据与Schema.org互补、SEO和内容聚合价值、在博客/电商中的应用 · 难度：进阶 · +15XP
HTML 微格式 —— 让人和机器都能读懂的标记
微格式（Microformats）是一种在HTML中嵌入结构化数据的方法，让搜索引擎和浏览器更容易理解你的内容。
h-card —— 联系人名片
<div class="h-card">
<span class="p-name">张三</span>
<span class="p-org">北京大学</span>
<a class="u-email" href="mailto:zhang@example.com">zhang@example.com</a>
</div>h-entry —— 文章/博客条目
<article class="h-entry">
<h1 class="p-name">我的第一篇文章</h1>
<time class="dt-published" datetime="2024-01-15">2024年1月15日</time>
<div class="e-content">这是文章正文内容。</div>
</article>微格式 vs 微数据 vs JSON-LD
| 方式 | 优点 | 缺点 |
|---|---|---|
| Microformats | 直接在class中，简单 | 表达能力有限 |
| Microdata | W3C标准，丰富 | 语法冗长 |
| JSON-LD | 不侵入HTML，推荐 | 需单独维护 |
动手练习
- 基础练习：用h-card做一个个人名片，包含姓名、公司、邮箱。
- 进阶应用：用h-entry标记一篇博客文章。
- 项目实战：对比Microformats和JSON-LD，给同一个页面分别用两种方式标注结构化数据。