seo之google rich-snippets丰富网页摘要结构化数据(微数据)实例代码

网页摘要是搜索引擎搜索结果下的几行字,用户能通过网页摘要迅速了解到网页的大概内容,传统的摘要是纯文字摘要,而结构化数据则提供了更多丰富选项,如内容评分。

什么是结构化数据(微数据)?
谷歌的微数据是根据你的html代码来标注的,如果你代码写得规范,会有很多意想不到的收获。
丰富网页摘要(微数据、微格式、RDFa 和数据标注工具)
摘要是指每条搜索结果下方显示的几行文字,旨在让用户大体了解网页上的内容,以及与用户的搜索查询有何关联。

如果 Google 了解您网页上的内容,就可以创建丰富网页摘要,也就是为用户的具体查询提供帮助的详细信息。
例如,针对餐馆的摘要可能会显示平均评分和价格范围;
针对食谱 网页的摘要可能会显示总的准备时间、照片以及对食谱的评分;
而针对音乐专辑的摘要可能会列出各首歌曲以及播放链接。
这些丰富网页摘要可帮助用户了解您的网 站与他们的搜索内容是否相关,并可能让您的网页获得更多点击次数。

通过结构化数据可以让搜索引擎更直接有效地了解和展示网页的重要信息,如内容评分。
结构化数据方法有多种,如微数据,如微格式,如RDFa,等等。
具体规范参考 HTML5 微数据规范,更多项目推荐使用 schema.org 来标记,因为 schema.org 的词汇 Google、Microsoft 和 Yahoo! 都能理解。

文章页内容:WebPage - schema.org
http://schema.org/WebPage
Example 1

<body itemscope="" itemtype="http://schema.org/WebPage">
<h1 itemprop="name">Lecture 12: Graphs, networks, incidence matrices</h1>
<p itemprop="description">These video lectures of Professor Gilbert
Strang teaching 18.06 were recorded in Fall 1999 and do not
correspond precisely to the current edition of the textbook.</p>
<div itemprop="publisher" itemscope="" itemtype="http://schema.org/CollegeOrUniversity">
<h4 class="footer">About <span itemprop="name">MIT OpenCourseWare</span></h4>
</div>
<a itemprop="license"
rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/us/deed.en_US"><img
src="/images/cc_by-nc-sa.png" alt="Creative Commons logo with terms BY-NC-SA." /></a>
</body>

Example 2

<body itemscope itemtype="http://schema.org/WebPage">
...
<div itemprop="breadcrumb">
<a href="category/books.html">Books</a> >
<a href="category/books-literature.html">Literature & Fiction</a> >
<a href="category/books-classics">Classics</a>
</div>
<div itemprop="mainEntity" itemscope itemtype="http://schema.org/Book">
<img itemprop="image" src="catcher-in-the-rye-book-cover.jpg"
alt="cover art: red horse, city in background"/>
<span itemprop="name">The Catcher in the Rye</span> -
<link itemprop="bookFormat" href="http://schema.org/Paperback">Mass Market Paperback
by <a itemprop="author" href="/author/jd_salinger.html">J.D. Salinger</a>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
<span itemprop="ratingValue">4</span> stars -
<span itemprop="reviewCount">3077</span> reviews
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
Price: $<span itemprop="price">6.99</span>
<meta itemprop="priceCurrency" content="USD" />
<link itemprop="availability" href="http://schema.org/InStock">In Stock
</div>
Product details
<span itemprop="numberOfPages">224</span> pages
Publisher: <span itemprop="publisher">Little, Brown, and Company</span> -
<meta itemprop="datePublished" content="1991-05-01">May 1, 1991
Language: <span itemprop="inLanguage">English</span>
ISBN-10: <span itemprop="isbn">0316769487</span>
Reviews:
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<span itemprop="reviewRating">5</span> stars -
<b>"<span itemprop="name">A masterpiece of literature</span>"</b>
by <span itemprop="author">John Doe</span>,
Written on <meta itemprop="datePublished" content="2006-05-04">May 4, 2006
<span itemprop="reviewBody">I really enjoyed this book. It captures the essential
challenge people face as they try make sense of their lives and grow to adulthood.</span>
</div>
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<span itemprop="reviewRating">4</span> stars -
<b>"<span itemprop="name">A good read.</span>" </b>
by <span itemprop="author">Bob Smith</span>,
Written on <meta itemprop="datePublished" content="2006-06-15">June 15, 2006
<span itemprop="reviewBody">Catcher in the Rye is a fun book. It's a good book to read.</span>
</div>
</div>
...
</body>

--------------------------------
食谱:Recipe - schema.org
http://schema.org/Recipe

<div itemscope itemtype="http://schema.org/Recipe">
<span itemprop="name">Mom's World Famous Banana Bread</span>
By <span itemprop="author">John Smith</span>,
<meta itemprop="datePublished" content="2009-05-08">May 8, 2009
<img itemprop="image" src="bananabread.jpg"
alt="Banana bread on a plate" />
<span itemprop="description">This classic banana bread recipe comes
from my mom -- the walnuts add a nice texture and flavor to the banana
bread.</span>
Prep Time: <meta itemprop="prepTime" content="PT15M">15 minutes
Cook time: <meta itemprop="cookTime" content="PT1H">1 hour
Yield: <span itemprop="recipeYield">1 loaf</span>
Tags: <link itemprop="suitableForDiet" href="http://schema.org/LowFatDiet" />Low fat
<div itemprop="nutrition"
itemscope itemtype="http://schema.org/NutritionInformation">
Nutrition facts:
<span itemprop="calories">240 calories</span>,
<span itemprop="fatContent">9 grams fat</span>
</div>
Ingredients:
- <span itemprop="recipeIngredient">3 or 4 ripe bananas, smashed</span>
- <span itemprop="recipeIngredient">1 egg</span>
- <span itemprop="recipeIngredient">3/4 cup of sugar</span>
...
Instructions:
<span itemprop="recipeInstructions">
Preheat the oven to 350 degrees. Mix in the ingredients in a bowl. Add
the flour last. Pour the mixture into a loaf pan and bake for one hour.
</span>
140 comments:
<div itemprop="interactionStatistic" itemscope itemtype="http://schema.org/InteractionCounter">
<meta itemprop="interactionType" content="http://schema.org/CommentAction" />
<meta itemprop="userInteractionCount" content="140" />
</div>
From Janel, May 5 -- thank you, great recipe!
...
</div>

--------------------------------
评论内容:Review - schema.org
http://schema.org/Review

<div itemscope itemtype="http://schema.org/Product">
<span itemprop="name">Kenmore White 17" Microwave</span>
<img itemprop="image" src="kenmore-microwave-17in.jpg" alt='Kenmore 17" Microwave' />
<div itemprop="aggregateRating"
itemscope itemtype="http://schema.org/AggregateRating">
Rated <span itemprop="ratingValue">3.5</span>/5
based on <span itemprop="reviewCount">11</span> customer reviews
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<!--price is 1000, a number, with locale-specific thousands separator
and decimal mark, and the $ character is marked up with the
machine-readable code "USD" -->
<span itemprop="priceCurrency" content="USD">$</span><span
itemprop="price" content="1000.00">1,000.00</span>
<link itemprop="availability" href="http://schema.org/InStock" />In stock
</div>
Product description:
<span itemprop="description">0.7 cubic feet countertop microwave.
Has six preset cooking categories and convenience features like
Add-A-Minute and Child Lock.</span>
Customer reviews:
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<span itemprop="name">Not a happy camper</span> -
by <span itemprop="author">Ellie</span>,
<meta itemprop="datePublished" content="2011-04-01">April 1, 2011
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
<meta itemprop="worstRating" content = "1">
<span itemprop="ratingValue">1</span>/
<span itemprop="bestRating">5</span>stars
</div>
<span itemprop="description">The lamp burned out and now I have to replace
it. </span>
</div>
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<span itemprop="name">Value purchase</span> -
by <span itemprop="author">Lucas</span>,
<meta itemprop="datePublished" content="2011-03-25">March 25, 2011
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
<meta itemprop="worstRating" content = "1"/>
<span itemprop="ratingValue">4</span>/
<span itemprop="bestRating">5</span>stars
</div>
<span itemprop="description">Great microwave for the price. It is small and
fits in my apartment.</span>
</div>
...
</div>

在百度使用结构化数据,你需要按既定格式专门提交一个 sitemap 来展示,而且需要权限,同时也还是处于邀请加入阶段。不过对于 WordPress 和 Discuz 都有结构化数据插件,虽然只是基础的博客内容和论坛数据,倒也可以试试看。

------------------------------

google rich-snippets 关于丰富网页摘要和结构化数据

提供丰富网页摘要的三个步骤:
1. 选择标记格式。
Google 推荐使用微数据,不过也接受以下三种格式。您无需事先了解这些格式,只要了解 HTML 基础知识即可。您可参考结构化数据标记帮助文档了解如何将微数据添加到自己的网站。
微数据(推荐)
微格式
RDFa

2. 标记您的内容。
对于以下内容类型,Google 支持丰富网页摘要:
评价
人物
商品
商家和组织
食谱
活动
音乐

Google 还可识别视频内容的标记,并用它来改进搜索结果。

3. 测试您的标记。
使用结构化数据测试工具确保 Google 可以读取和提取您的标记数据。

在您添加并测试了丰富网页摘要标记后,Google 在下次抓取您的网站时就会发现该标记。需要注意的几点:
丰富网页摘要可能过一段时间才会显示在搜索结果或地方信息页中。
如果无法找到您网站的丰富网页摘要,请查看可能导致该情况的原因。
对您的数据标记丰富网页摘要并不会影响您的网页在搜索结果中的排名,而且 Google 也不保证一定会使用您的标记。

除了向您的所有网页添加 HTML 标记外,您还可以使用数据标注工具帮助 Google 了解您网页的内容。数据标注工具是网站站长工具的一种,用于向 Google 说明您网站上结构化数据的格式。您只需借助鼠标即可使用数据标注工具标记您网站上的数据字段。然后,Google 便会在搜索结果以及 Google 知识图等其他产品中,以更加醒目的全新方式呈现您的数据。
哪种方法适合您?
HTML 标记的适用情况...
您希望明确掌握 Google 如何了解您网站上的活动、食谱或其他类型的数据。
您可以持续为所有数据项添加 HTML 标记。
您的网站结构变动频繁。
您希望除 Google 外的其他搜索引擎能了解您网站上内容(数据荧光笔提取的数据仅适用于 Google)。

数据标注工具的适用情况...
您的网站会显示有关活动的数据。
您正在考虑为自己的网站采用结构化数据和丰富网页摘要,但还没准备好投入资源以更新 HTML 标记。
您更希望在网页上点击标注,而不是编写 HTML 标记。
您无法更改网站上的 HTML 标记或无法持续标记数据项。

要使用数据标注工具,请参见关于数据标注工具。

请注意:
数据标注工具不会向 Google 说明已包含用于指定数据结构的 HTML 标记的网页。即使网站上的部分网页已经包含 HTML 标记,您也仍然可以针对其使用数据标注工具,但是该工具只会向 Google 说明不包含标记的网页。

关于微数据 HTML5 微数据规范是标记内容的一种方式,用于描述特定的信息类型,例如评论、人物信息或活动。每种信息都描述特定类型的项,例如人物、活动或评论。例如,活动可以包含 venue、starting time、name 和 category 属性。

微数据使用 HTML 标记(常为 <span> 或 <div>)中的简单属性为项和属性指定简要的描述性名称。

seo之google rich-snippets丰富网页摘要结构化数据(微数据)实例代码的更多相关文章

  1. Html网页表格结构化标记的应用

    在讲网页表格的结构化标记之前,还是先看几幅图片. Html表格的结构化 所谓的结构化,正如上述第一副图所看到的,就是把我们的表格划分为三种:表头.表体.表尾.从而当我们在改动表体部分的时候,不会影响到 ...

  2. HTML5扩展之微数据与丰富网页摘要

    一.微数据是? 一个页面的内容,例如人物.事件或评论不仅要给用户看,还要让机器可识别.而目前机器智能程度有限,要让其知会特定内容含义,我们需要使用规定的标签.属性名以及特定用法等.举个简单例子,我们使 ...

  3. HTML5扩展之微数据与丰富网页摘要itemscope, itemtype, itemprop

    HTML5扩展之微数据与丰富网页摘要 by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpr ...

  4. HTML5扩展之微数据与丰富网页摘要——张鑫旭

    一.微数据是? 一个页面的内容,例如人物.事件或评论不仅要给用户看,还要让机器可识别.而目前机器智能程度有限,要让其知会特定内容含义,我们需要使用规定的标签.属性名以及特定用法等.举个简单例子,我们使 ...

  5. WordPress插件--WP BaiDu Submit结构化数据插件又快又全的向百度提交网页

    一.WP BaiDu Submit 简介 WP BaiDu Submit帮助具有百度站长平台链接提交权限的用户自动提交最新文章,以保证新链接可以及时被百度收录. 安装WP BaiDu Submit后, ...

  6. 利用pandas库中的read_html方法快速抓取网页中常见的表格型数据

    本文转载自:https://www.makcyun.top/web_scraping_withpython2.html 需要学习的地方: (1)read_html的用法 作用:快速获取在html中页面 ...

  7. php获取网页中图片并保存到本地的代码

    php获取网页中图片并保存到本地的代码,将网页中图片保存本地文件夹: <?php /** * 获取网页中图片,并保存至本地 * by www.jbxue.com */ header(" ...

  8. java网页数据抓取实例

    在很多行业中,要对行业数据进行分类汇总,及时分析行业数据,对于公司未来的发展,有很好的参照和横向对比.所以,在实际工作,我们可能要遇到数据采集这个概念,数据采集的最终目的就是要获得数据,提取有用的数据 ...

  9. Highmaps网页图表教程之Highmaps第一个实例与图表构成

    Highmaps网页图表教程之Highmaps第一个实例与图表构成 Highmaps第一个实例 下面我们来实现本教程的第一个Highmaps实例. [实例1-1:hellomap]下面来制作一个中国地 ...

随机推荐

  1. iOS:创建Siri 功能

    前奏: iOS 10 出来之后,我们开发者也可以使用类似Siri的功能.它是使用Siri里面的一个语音识别框架Speech framework来处理siri的.现在, 让我们来看看 一些 主要的代码吧 ...

  2. saltstack之(六)配置管理state

    配置管理是saltstack工具最重要的模块之一,也是学习saltstack之后使用最多的一个功能.可以轻松实现上百台上千台甚至上万台服务器的管理工作. 1.使用state模块进行配置管理,编写sls ...

  3. free 命令

    free命令可以显示Linux系统中空闲的.已用的物理内存及swap内存,及被内核使用的buffer.在Linux系统监控的工具中,free命令是最经常使用的命令之一. 1.命令格式: free [参 ...

  4. APICloud请你看英特尔智能硬件大赛决赛直播

    英特尔智能硬件大赛由英特尔硬享公社(CCE)发起,联合了全国各地50余家产业链优秀合作伙伴,旨在集合全国硬创资源,携手寻找中国最具代表性的硬件创业项目,并通过技术支持.资源对接.产品推广等方式助力项目 ...

  5. Inside Kolla - 02 Kolla 是什么

    Kolla 是什么? Kolla 项目 Kolla 是 OpenStack 里面的一个项目,在源代码的 README.md 里面的解析是: The Kolla project is part of t ...

  6. meizu mx4 usb调试

    meizu mx4 打开 USB 调试模式 连接手机 连接 usb 调试前,要确定调试模式已打开 在 设置 -> 辅助功能 -> 开发者选项 -> USB 调试 上打开 USB 调试 ...

  7. 通过ping确定网卡mtu

    使用 ping 测试确定网卡最佳 MTU 的方法 MTU ( Maximum Transmission Unit ,最大传输单元)是指某一层协议上一次能最大传输的数据量.当一个数据包超过 MTU 数据 ...

  8. Vue.2.0.5-模板语法

    Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据.所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解 ...

  9. 最流行的PHP 代码规范

    “PHP是最好的编程语言” ;-) 那么PHPer习惯使用什么样的代码规范呢?sideeffect.kr通过分析GitHub上托管的开源代码,得出了一些有趣的结果,让我们一起来看看吧. 缩进 空格(7 ...

  10. linux gitlab nginx 安装 配置

    更新:bitnami-gitlab 7.8版本后界面发生变化 邮件问题: cd /data/server/gitlab/apps/gitlab/htdocs/config vim environmen ...