7

Google and other SEs support Schema.org for marking up structured data, but it turns out that for breadcrumbs Google recommends using Data-Vocabulary.org instead.

Which should we use for having breadcrumbs appear in search results?

Breadcrumb rich snippet example in Google SERP

I noticed that there are issues with the Schema.org markup for breadcrumbs, so does that mean it's best not to use it for now?

The code suggested in each is slightly different — so changing from one to the other site-wide in the future could be a nuisance:

Schema.org:

<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>

Data-Vocabulary.org:

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses" itemprop="url">
    <span itemprop="title">Dresses</span>
  </a> ›
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses/real" itemprop="url">
    <span itemprop="title">Real Dresses</span>
  </a> ›
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/clothes/dresses/real/green" itemprop="url">
    <span itemprop="title">Real Green Dresses</span>
  </a>
</div>
unor
  • 21,919
  • 3
  • 47
  • 121
Baumr
  • 1,444
  • 2
  • 20
  • 40

3 Answers3

3

Up-to-date answer, January 3rd, 2017

data-vocabulary.org - offers microdata for breadcrumbs for quite some time now. Simply use it like this:

  <div class="breadcrumb">
    <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="http://www.contoso.com/" itemprop="url">
        <span itemprop="title">Contoso</span>
      </a> »
    </span>  
    <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="http://www.contoso.com/fashion/" itemprop="url">
        <span itemprop="title">Fashion</span>
      </a> »
    </span>  
    <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="http://www.contoso.com/fashion/women/" itemprop="url">
        <span itemprop="title">Women</span>
      </a> »
    </span>
    <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="http://www.contoso.com/fashion/women/boots/" itemprop="url">
        <span itemprop="title">Boots</span>
      </a>
    </span>
  </div>

read the docs

schema.org - also offers the use of microdata for breadcrumbs! Simply use it like this:

  <ol itemscope itemtype="http://schema.org/BreadcrumbList">
    <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
      <a itemprop="item" href="https://example.com/dresses">
      <span itemprop="name">Dresses</span></a>
      <meta itemprop="position" content="1" />
    </li>
    <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
      <a itemprop="item" href="https://example.com/dresses/real">
      <span itemprop="name">Real Dresses</span></a>
      <meta itemprop="position" content="2" />
    </li>
  </ol>

read the docs

GDav: "John Mueller from Google has said that he expects Schema will have to change, and the discussion around it seems to suggest that Schema needs to be more like the current Data Vocabulary syntax, so any future adaptations you need to make may be less onerous than they currently appear."

Well I guess they changed, because now schema.org also supports breadcrumbs.

Please note: both data-vocabulary.org and schema.org use microdata for search engine optimization. Apperently there are ways to combine them, but I haven't found a live example, so if I were you I would choose one of them. And then use it for all your content (I mean that I wouldn't use data-vocabulary for your breadcrumbs and schema.org for your navigation menu).

Conclusion:

They both work, just choose one.

Derk Jan Speelman
  • 131
  • 4
3

Yes, avoid Schema for now and use Data Vocabulary, for exactly the reason you cite. I've used the latter, and it works.

John Mueller from Google has said that he expects Schema will have to change, and the discussion around it seems to suggest that Schema needs to be more like the current Data Vocabulary syntax, so any future adaptations you need to make may be less onerous than they currently appear.

Community
  • 1
GDVS
  • 7,803
  • 15
  • 33
1

Google does not offering data-vocabulary.org as a breadcrumbs option. Right now is just schema.org as you can see in https://developers.google.com/search/docs/data-types/breadcrumbs

Cristian Sepulveda
  • 11
  • 1