Barret Lee +
facebook send mail to barret sina weibo
关于微分享订阅 李靖的博客 » 技术 » blog
分类:
标签:

原文网址:http://schema.org/docs/gs.html
本文地址:http://barretlee.github.io/let-your-page-understood-by-search-engine
译者:Barret Lee
日期:

许多站长应该对HTML标签十分熟悉,HTML标签告诉浏览器如何去呈现标签的内容,比如<h1>阿凡达</h1>,告诉浏览器用大标题的形式显示“阿凡达”。但是,HTML标签本身并没有给出任何信息标识其中的内容,因此搜索引擎也无法智能地将相关的信息呈现给用户。

Schema.org提供了一些相关的词汇,开发者可以用这些词汇嵌入到HTML内容中来强化内容,以便更容易被Google、Microsoft、Yandex以及Yahoo等搜索引擎识别。

一、如何使用元数据(microdata)来表示内容

1.为什么使用元数据

人去阅读文章可以马上理解网页的相关内容,但是机器理解能力是十分有限的,给你的网页HTML添加一些额外的标签,让这些标签去告诉搜索引擎,“嘿,我描述的是一部电影,一个景点,一位名人或者一首音乐”,这样你就能让搜索引擎理解文章内容,并且让他在搜索结果中可以显示更多相关的内容。元数据是HTML5中的一些标签,他可以让你实现上述功能。

2.itemscope和itemtype

先举个简单的例子,比如你要显示“阿凡达”这部电影,包括这部电影的导演、类型,介绍,你的HTML代码可能会写成这样:

<div>
    <h1>阿凡达</h1>
    <span>导演: James Cameron (生于16-08-1954)</span>
    <span>科幻电影</span>
    <a href="http://barretlee.github.io/path/to/obj.html">Trailer</a>
</div>

刚开始我们来表示这一块是一个关于电影阿凡达的章节,我们需要给HTML添加itemscope属性

<div itemscope>
    <h1>阿凡达</h1>
    <span>导演: James Cameron (生于16-08-1954)</span>
    <span>科幻电影</span>
    <a href="http://barretlee.github.io/path/to/obj.html">Trailer</a>
</div>

通过添加itemscope属性,搜索引擎就知道了这个div块表示的是一个特定的内容。为了让这个内容更加具体,我们可以继续添加一个itemtype属性

<div itemscope itemtype="http://schema.org/Movie">
    <h1>阿凡达</h1>
    <span>导演: James Cameron (生于16-08-1954)</span>
    <span>科幻电影</span>
    <a href="http://barretlee.github.io/path/to/obj.html">Trailer</a>
</div>

这样蜘蛛就知道了这块的内容是介绍一部电影了。

3.itemprop

我们还能为搜索引擎提供什么其他的信息?电影有一些属性,如主演,导演,评分等。为了表示这些属性,我们可以使用itemprop:

<div itemscope itemtype ="http://schema.org/Movie">
    <h1 itemprop="name">阿凡达</h1>
    <span>导演: <span itemprop="director">James Cameron</span> (生于16-08-1954)</span>
    <span itemprop="genre">科幻电影</span>
    <a href="http://barretlee.github.io/path/to/obj.html" itemprop="trailer">Trailer</a>
</div>

4.内嵌一个itemscope

有时候作为一个itemprop的属性也可以单独出来成为itemscope,比如导演,他是属于Person,Person也有很多诸如名字,生日等属性。

<div itemscope itemtype ="http://schema.org/Movie">
    <h1 itemprop="name">阿凡达</h1>
    <div itemprop="director" itemscope itemtype="http://schema.org/Person">
        导演: <span itemprop="name">James Cameron</span> (生于 <span itemprop="birthDate">16-08-1954</span>
    </div>
    <span itemprop="genre">科幻电影</span>
    <a href="http://barretlee.github.io/path/to/obj.html" itemprop="trailer">Trailer</a>
</div>

二、使用 schema.org 提供的属性

1.schema.org 提供的类型和属性

并不是所有的网页都是关于电影和人物介绍的,除了上面我们说到的Movies和Person之外,schema.org还提供了一系列的类型,以及这些类型对应的属性。

用的最多的是Thing这个类型,他有四个属性,name、description、url、image。这个类型对很多内容都实用。下面是一些常用的类型和属性:

这里有一个对类型的列表,戳我//Barret Say:schema给出的列表是规范统一的,对于你要用到的类,他基本上都有定义,不要自己构造他没有提到的类型。试想一下,如果每个人都给自己的内容定义多个类型,那搜索引擎该根据哪个标准来分类了,其结果就跟没有分类是一样的。

2.期望的类型,文字和URL地址

使用schema.org来标记你的网页时,有几点要注意:

3.测试你的标记

Google提供了许多相关的测试工具来测试这些schema标记语法,比如这个:google webmasters,你可以用这些工具来检测格式是不是正确。

三、进阶话题:机器可理解的版本信息

许多页面可以用itemscope,itemtype以及itemprop来定义,但是有的时候,如果不加另外的注释,搜索引擎是很难理解某些属性的:

1.时间,日期

<time datetime="2011-04-01">04/01/11</time>
<time datetime="2011-05-08T19:30">May 8, 7:30pm</time>
<time itemprop="cookTime" datetime="PT1H30M">1 1/2 hrs</time>

关于这些时间日期格式化的规范,请参看:ISO 8601 date/time standard

2.枚举以及引用等

3.缺失以及隐含的信息

因后面几个用的比较少,如果要做具体了解,请移步原网页

作者:Barret Lee
出处:http://barretlee.github.io/let-your-page-understood-by-search-engine
本文版权归作者所有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。
分类: 标签:
点击查看评论