Breadcrumbs on current page - html

Question

I have currently implemented my breadcrumbs like this:
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="HOME URL" itemprop="url">
<span itemprop="title">HOME TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="1ST LEVEL URL" itemprop="url">
<span itemprop="title">1ST LEVEL TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">CURRENT TITLE</span>
</div>
As you can see, I haven't specified a url for the current page, which would be redundant.
But when I try the Google testing tool, I get an error saying that the url is missing for the current page breadcrumb.
Given that, I have three options that I can think of.
I specify a url for the current page:
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="HOME URL" itemprop="url">
<span itemprop="title">HOME TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="1ST LEVEL URL" itemprop="url">
<span itemprop="title">1ST LEVEL TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="CURRENT LEVEL URL" itemprop="url">
<span itemprop="title">CURRENT TITLE</span>
</a>
</div>
I just display the current page title without including it in the structured data markings:
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="HOME URL" itemprop="url">
<span itemprop="title">HOME TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="1ST LEVEL URL" itemprop="url">
<span itemprop="title">1ST LEVEL TITLE</span>
</a> >
</div>
<span>CURRENT TITLE</span>
I don't display the current level in the breadcrumbs (I don't want to do that I must say):
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="HOME URL" itemprop="url">
<span itemprop="title">HOME TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="1ST LEVEL URL" itemprop="url">
<span itemprop="title">1ST LEVEL TITLE</span>
</a>
</div>
What do you think it's best I should do?

Answer 1

The solution is to use the <meta> tag.
So, the last item in your breadcrumb should look like this:
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">CURRENT TITLE</span>
<meta itemprop="url" content="CURRENT URL" />
</div>
This will validate on the Google testing tool and achieve your desired goal to construct a valid breadcrumb without "displaying" a redundant link.
For reference: Getting started with schema.org using Microdata
3c. Missing/implicit information: use the meta tag with content
Sometimes, a web page has information that would be valuable to mark
up, but the information can't be marked up because of the way it
appears on the page... In these cases, use the meta tag along with the content attribute to
specify the information.
Have to add that for sake of completeness that to have a properly formatted breadcrumb for Google SERP, according to their current specs, your example code should look like this:
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb" id="a" itemref="b">
<a href="HOME URL" itemprop="url">
<span itemprop="title">HOME TITLE</span>
</a>
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb" id="b" itemprop="child" itemref="c">
<a href="1ST LEVEL URL" itemprop="url">
<span itemprop="title">1ST LEVEL TITLE</span>
</a>
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb" id="c" itemprop="child">
<span itemprop="title">CURRENT TITLE</span>
<meta itemprop="url" content="CURRENT URL" />
</div>
Bear also in mind that the Google breadcrumb documentation is due for review shortly, since it seems that, at last, Google has adopted the schema.org markup for breadcrumbs from what can be inferred from the "Better presentation of URLs in search results" post in the Official Google Webmaster Central Blog and discussion on it.

Answer 2

I would go with the option of just showing the title, current level not included in the markup as below. IMHO you don't have to include the current page in breadcrumb, as the SERP will anyway point to the current page. It makes sense to provide breadcrumb from one level higher than the current page. hope this helps. BTW, we have done it that in our organization.
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="HOME URL" itemprop="url">
<span itemprop="title">HOME TITLE</span>
</a> >
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="1ST LEVEL URL" itemprop="url">
<span itemprop="title">1ST LEVEL TITLE</span>
</a> >
</div>
<span>CURRENT TITLE</span>