微型數據面包屑的HTML5驗證

Question

我正在嘗試驗證我的頁面，現在拋出的唯一錯誤是：

目前，元素a上不允許使用itemprop屬性。

我的代碼如下：

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses" itemprop="url">
    <span itemprop="title">Dresses</span>
  </a>
</div>  

這是Google在以下頁面上發送的電子郵件：

面包屑

這里似乎也遵循HTML5微數據規范：

HTML5微數據

有什么想法為什么不能驗證？ 我缺少什么，或者對於驗證者而言，這太新了以至於無法驗證？

Answer 1

要使面包屑顯示在SERP中，請像這樣編寫您的schema.org標記。 請注意div嵌套和“ child”屬性：

<div class="breadcrumb" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">

  <span class="breadcrumb-lead">YOU ARE HERE:</span>
  <a title="Go to %title%." href="%link%" class="%type%" itemprop="url">
  <span itemprop="title">Homepage</span></a>

  <div itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb" style="display: inline;">
    <a title="Go to %title%." href="%link%" class="%type%" itemprop="url">
    <span itemprop="title">Category One</span></a>
  </div>

  <div itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb" style="display: inline;">
    <a title="Go to %title%." href="%link%" class="%type%" itemprop="url">
    <span itemprop="title">Category Two</span></a>
  </div>

</div>

這可以在Google結構化數據測試工具中進行驗證：

http://www.google.com/webmasters/tools/richsnippets

有關面包屑的schema.org標記的很多文檔都是錯誤的。 有一些關於這個的話題。 以上是我的工作解決方案，希望對您有所幫助。

Answer 2

schema.org已經取代了data-vocabulary.org。 Schema.org模式已得到主要搜索引擎的同意。 並且Schema.org在其架構中沒有itemprop = url。 因此，可能是Google的工具或其搜索引擎機器人已停止遵循data-vocabulary.org模式。 無論如何，最好轉移到Schema.org Breadcrumb 。

Itemtype-WebPage是網頁的默認設置。 因此，即使您不提供itemtype-WebPage並提供BreadCrumb類型，Google也會將其理解為Breadcrumb。 我在Schema.org頁面中閱讀了此內容。 我已經給你鏈接了。

使用此Google 工具進行驗證。

Answer 3

    <ol itemscope itemtype="http://schema.org/BreadcrumbList">
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://www.example.com">
        <span itemprop="name">Home</span></a>
    <meta itemprop="position" content="1" />
  </li>
  ›
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://www.example.com/category1">
      <span itemprop="name">Category 1</span></a>
    <meta itemprop="position" content="2" />
  </li>
  ›
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://www.example.com/category1/subcategory">
      <span itemprop="name">SubCategory</span></a>
    <meta itemprop="position" content="3" />
  </li>
</ol>

這會將與面包屑有關的許多數據公開給搜尋器。 如果使列表項內聯，則輸出將如下所示：

1.主頁> 2.類別> 3.子類別

Answer 4

您使用的是哪個驗證者？ 有些不支持HTML5的最新功能，有些則支持，但是由於聲明的文檔類型而不會觸發對文檔的正確驗證。

但是，新發布的Nu驗證程序應該不會出現這些問題。 您可以在.net雜志上閱讀有關內容。