个人小站

HTML5 数据结构(structured-data) 之 微数据(microdata)

字数统计: 810阅读时长: 3 min
2021/08/05

知道微数据是因为谷歌告诉我https://ted423.bitcron.com/post/anime/tangled这个页面的数据结构有问题(最后发现class里有个vevent,所以谷歌认为这是一个活动)

经过搜索,终于了解了微数据这么一个东西,微数据是为了方便机器(搜索引擎)识别而产生的东西。其有特定的规范,有特定的格式。可以丰富搜索引擎的网页摘要。

本人按自己的理解乱说了一通,不保证本篇文章具备学术严谨性。

还是以此为例说下

魔发奇缘
Tangled
Tangled poster on zh Wikipedia.jpg
导演 纳桑·格莱诺
拜伦·霍华德(Byron Howard)
监制 罗伊·康丽
约翰·雷斯特
格兰·基恩
菲力浦·洛法罗
剧本 丹·佛格曼
原著 长发姑娘
旁白 克里斯·柯林斯
主演 曼迪·穆尔
扎卡里·李维
唐娜·墨菲
(Donna Murphy )
配乐作曲 亚伦·孟肯
Glenn Slater (歌词)
剪辑 提姆·墨腾斯
制片商 华特迪士尼动画工作室
产地  美国
语言 英语
上映及发行
上映日期 美国 2010年11月24日
新加坡 2010年11月25日
台湾 香港 2011年2月3日
中国未上映
(其他国家)
发行商 美国 华特迪士尼
香港 洲立
预算 2亿6,000万美元
票房 5亿90,721,936美元

其中itemscope标记了这块HTML标签具有微数据特性,该标签应该同时具有itemtype来说明这块微数据描述的是什么。
比方说所上面那一块

1
<table itemscope itemtype="https://schema.org/Movie" style="font-size:10px;">

搜索引擎通过发现itemtypehttps://schema.org/Movie,就能明白这说的是一部电影。
itemprop则是具体元素,比方说

1
<span itemprop="name">魔发奇缘<br><small>Tangled</small></span>

再有itemref可以在itemtype里再嵌套一个itemtype
类似这种

1
<meta itemprop="worksFor" itemscope itemtype="http://schema.org/Organization" itemref="organization">

itemid则是全局唯一标志,这个应该比较好理解,比方说身份证号什么的。

可以用结构化数据工具查看微数据用的有没有问题
https://developers.google.com/structured-data/testing-tool/?url=http://ted423.bitcron.com/post/videos/film/tangled

微数据的作用在于能较好的转化为json
https://foolip.org/microdatajs/live/
可以看到上文表格可以转化为

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
{
"items": [
{
"type": [
"https://schema.org/Movie"
],
"properties": {
"name": [
"魔发奇缘Tangled"
],
"image": [
"https://upload.wikimedia.org/wikipedia/zh/e/e6/Tangled_poster_on_zh_Wikipedia.jpg"
],
"director": [
"纳桑·格莱诺\n 拜伦·霍华德(Byron Howard)\n "
],
"actor": [
"曼迪·穆尔\n 扎卡里·李维\n 唐娜·墨菲\n (Donna Murphy\n \n )\n \n "
],
"copyrightHolder": [
"华特迪士尼动画工作室\n "
],
"locationCreated": [
"http://zh.wikipedia.org/wiki/%E7%BE%8E%E5%9C%8B"
],
"Duration": [
"\n 上映日期\n 2010年11月24日\n 2010年11月25日\n \n \n \t\n \n 2011年2月3日\n 未上映\n (其他国家)\n \n "
],
"datePublished": [
"\n 上映日期\n 2010年11月24日\n 2010年11月25日\n \n \n \t\n \n 2011年2月3日\n 未上映\n (其他国家)\n \n "
],
"publisher": [
" \n 华特迪士尼\n 洲立"
]
}
}
]
}

原文作者:ted423

原文链接:http://ted423.github.io/Code/WWW/itemscope/

发表日期:August 5th 2021, 7:32:09 pm

更新日期:March 8th 2016, 8:02:00 am

版权声明:本站原创内容(一般是语句不通顺的那种)采用知识共享署名-非商业性使用 4.0 国际许可协议进行许可,转载内容以及不带个人观点的分享不在此例,摘抄有Wiki的内容的文章统一根据Wiki采用 CC BY-SA 3.0

CATALOG