一、微数据的定义
开门见山,微数据使用来自自定义词汇表的、带作用域的名/值对来给DOM做标记。
自定义词汇表:我们可以将“HTML5中所有元素的集合”看做一个词汇表,这个词汇表包括了可以代表章节或者文章的元素,但是不包括可以代表一个人或者活动的元素,如果要想表示一个“人”,那么就需要定义自己的词汇表,使用微数据就可以定义这样的词汇表。
作用域:微数据的作用域可以参照DOM中的元素之间的自然父子关系,微数据重用了DOM本身的层级结构,提供了一种方式来表达“所有该元素的属性都来自这个词汇表”。
名/值对:每一个微数据词汇表都定义了一组命名属性,一个微数据的属性名总是声明在一个HTML元素中。相对应的属性值则从DOM中获取。对于大多数HTML元素而言,属性值就是元素的文本内容。但也有少数例外,如下表:
元素 | 值 |
<meta> | content属性 |
<audio> <embed> <iframe> <img> <source> <video> | src属性 |
<a> <area> <link> | href属性 |
<object> | data属性 |
<time> | datetime属性 |
所有其他元素 | 文本内容 |
二、为什么要使用微数据?
“添加微数据”到网页就是给已有的那些HTML元素增添一些属性,那就不得不问“为什么我们要使用微数据”,难道只是为了增加语义而增加语义吗?
事实上,有两类主要的应用程序会消费HTML及其扩展,以及HTML5微数据:
- Web浏览器
- 搜索引擎
对于浏览器,HTML5定义了一组DOM API,用于从网页上提取微数据项目、属性以及属性值。实际上支持微数据的浏览器基本上等于没有,坑爹呐!也许在未来某一天主流浏览器都会实现这些客户端API吧……
而另一个主要的HTML消费者就是搜索引擎。一个搜索引擎会用关于一个人的微数据属性来干嘛呢?想象一下,搜索引擎可以继承并显示一些结构化的信息,而不仅仅是显示页面标题和一些摘要文字。这些结构化信息包括:姓名、职称、工作单位、地址,甚至一个资料照片缩略图。
Google支持微数据,其Rich Snippets计划就包含了对微数据的支持。当Google的Web抓取工具分析到你的网页,并找到符合词汇表的微数据属性,就会开始解析属性数据,同页面其余数据一并存储。实际上利用这种抓取效果,你就可以得到搜索公司的优待,为你提供定制的搜索结果页。
三、微数据的格式
itemscope:声明你所要添加的属性的作用域,加在最外层的元素。
itemtype:声明所使用的词汇表,加在最外层的元素中。
itemprop:声明属性名,具体的内容要参加所引用的词汇表。
实例:
12 Google, Inc.
34 1600 Amphitheatre Parkway
5 Mountain View, CA 94043 6 USA 7 8650-253-0000
9 10
添加微数据修改后:
12 Google, Inc.
35 1600 Amphitheatre Parkway 6 Mountain View 7 CA 8 94043 9 USA10
11650-253-0000
12 13
※ 以上部分内容来自《HTML5揭秘》Mark Pilgrim著. 电子工业出版社