Breadcrumb using and schema.org rich snippets

Posted by Adam Jenkin on Pro Webmasters See other posts from Pro Webmasters or by Adam Jenkin
Published on 2012-08-01T08:33:40Z Indexed on 2012/08/31 15:53 UTC
Read the original article Hit count: 394

Filed under:

I am having problems implementing the breadcrumb rich snippets from schema.org. When I construct my breadcrumb using the documentation and run via Google Rich Snippet testing tool, the breadcrumb is identified but not shown in the preview.

<!DOCTYPE html>
<html>
  <head>
    <title>My Test Page</title>
  </head>
  <body itemscope itemtype="http://schema.org/WebPage">     
      <strong>You are here: </strong>
      <div itemprop="breadcrumb">
        <a title="Home" href="/">Home</a> >
        <a title="Test Pages" href="/Test-Pages/">Test Pages</a> >
      </div>
  </body>
</html>

If I change to use the snippets from data-vocabulary.org, the rich snippets show correctly in the preview.

<!DOCTYPE html>
<html>
  <head>
    <title>My Test Page</title>
  </head>
  <body>
      <strong>You are here: </strong>
      <ol itemprop="breadcrumb">
        <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
          <a href="/" itemprop="url">
            <span itemprop="title">Home</span>
          </a>
        </li>
        <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
          <a href="/Test-Pages/" itemprop="url">
            <span itemprop="title">Test Pages</span>
          </a>
        </li>
      </ol>
  </body>
</html>

I want the breadcrumb to be shown in the search result rather than the url to the page.

Given that schema.org is the recommended way to be using rich snippets, I would rather use this, however as the breadcrumb is not showing in the preview of the search result using this method, i'm not convinced this is working correctly.

Am I doing something wrong in the markup for schema.org example?

© Pro Webmasters or respective owner

Related posts about rich-snippets