【郑州分院第一百零四期】微格式

microformat

1.背景介绍

由于HTML中缺少相应的元素，很难突出显示人、地点或日期等类型的信息。为了解决这个问题，有一组开发人员决定开发一套标准的命名约定盒标记模式来表示这些数据。这些命名约定基于vCard（电子名片）和iCalendar（日历数据交换）等现有的数据格式，现在称为微格式（microformat)。

2.知识剖析

2.1   microformat定义

建立在已有的、被广泛采用的标准基础之上的一组简单的、开放的数据格式（microformats.org官方定义）。是把语义嵌入到HTML以便有助于分离式开发而制定的一些简单约定，是兼顾人机可读性设计的数据表达方式，对Web网页进行语义注解的方法。

2.2  微格式在实际应用中的意义和作用又是什么呢？

微格式按照某种已有的被广泛应用的标准，通过对内容块的语义标记，可以让外部应用程序、聚合程序和搜索引擎能够做以下事情：

1、在捉取Web内容时，能够更为准确地识别内容块的语义；

2、对内容进行操作，包括提供访问、校对，还可以将其转化成其他的相关格式，提供给外部程序和Web服务使用。

2.3 简单的微格式

我们从上面的描述知道，微格式实际就是为现有的(X)HTML元素添加元数据和其他属性，增强语义。那么我们就来看一个简单的微格式应用吧。

以前我们是这样写一个链接到首页的代码的：

而现在我们要为这个代码元素a加上rel属性。

上面的链接标记a包括rel=”homepage”属性，该属性显示链接的目标页面是该网站的首页。通过为已有的链接元素添加语义化属性，就为这个链接添加了具体的结构和意义。

2.4 hCard 微格式

hCard是一种微格式，用来发布个人，公司，组织，地点等详细的联系信息。

它可以使分析器（比如其他网站，Firefox的Operator插件）获得详细的信息，并通过别的网站或者地图工具进行显示，或者载入到地址簿等其他程序。

2.5 示例一

加入微格式后，成为：

这里，正式名称（class=”fn”），组织（class=”org”），电话号码（class=”tel”）和url（class=”url”）分别用相应的class标示；同时，所有内容都包含在class="vcard"里。

2.6 示例二

这里是维基媒体基金会的联系方式，可以作为hCard的一个真实示例：

Wikimedia Foundation Inc.

200 2nd Ave. South #358

St. Petersburg, FL 33701-4313

USA

Phone: +1-727-231-0101

Email: [email protected]

Fax: +1-727-258-0207

加入微格式后，成为：

2.7 其他常用的hCard属性包括：

bday – 生日

email

honorific-prefix -（西式）名字前的尊称，例如：博士（Dr.）、牧师（Rev.）等，在东方会放在名字的后方。

honorific-suffix -（西式）名字后的尊称，一般都是封衔，例如：太平绅士（JP）、大紫荆勋章（GBM），一般详列在名字的最后方。

logo

nickname – 昵称、爱称或外号。西方人的名字一般都有简写，有时这些昵称或外号就用来分辨同名的人。例如：William “Bill” Gates 中间的”Bill”。

note

目前已具备完整规范的微格式还包括：hCard、hCalendar、XOXO、XFN、VoteLinks和3个“rel-”微格式：rel- license、rel-nofollow和rel-tag。

三.常见问题

你可能会问，既然 hCard 对网页的浏览者是完全透明的，那我们为什么又要费神费力地在网页中添加 hCard 呢？

目前看来，这似乎是一件费力不讨好的事情，因为 hCard 等微格式尚未得到浏览器和终端设备的良好支持。但是一旦这些不足得到了改善，hCard 就会为我们的数字生活带来很大的便利。

四.解决方案

来看几个例子

当我用手机浏览某公司的网站时，手机浏览器识别出了网页中的 hCard 信息。这个 hCard 标记了该公司的多种联络方式，手机浏览器很聪明地提示我“是否保存到通讯录”，于是我很经松地保存了我所需要的信息。

手机浏览器还可以将页面中的 hCard 导出为 VCF 文件，我将 VCF 文件用蓝牙传输到同事的手机上，他们也轻松保存了这些联系信息，同时也可以方便地同步到电脑上的通讯录软件中。

此外，Firefox 的 Operator 扩展还提供了一些针对微格式的在线应用，比如“使用 Google 地图查找”、“添加至雅虎通讯录”等等，有效地丰富了 hCard 的应用范围。

五.编码实战

见上面的知识剖析

六.拓展思考

大家知道的微格式或者用过的微格式有哪些？

七.更多讨论

说到“微格式”，有人力捧，有人质疑。尽管如此，而作为网站开发者和个人站长，你对“微格式”的应用仍在观望之中吗？

八.参考文献

什么是微格式及经典实例演示_网页设计

为网页添加hCard微格式

PPT链接：https://ptteng.github.io/PPT/PPT/css-Microformat.html#/4

视频链接：https://v.qq.com/x/page/w0501o0at82.html

文本链接：http://www.jnshu.com/daily/22509

microformat微格式_腾讯视频