当前页面上的面包屑

Question

我目前已经实现了这样的面包屑：

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

如您所见，我没有为当前页面指定 url，这是多余的。但是当我尝试 Google testing tool 时，我收到一条错误消息，指出当前页面面包屑缺少 url。

鉴于此，我可以想到三个选项。

我为当前页面指定一个url：

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

我只显示当前页面标题，没有将其包含在结构化数据标记中：

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

我不在面包屑中显示当前级别（我不想这样做，我必须说）：

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

你认为我最好做什么？

Answer 1

我会选择只显示标题的选项，当前级别不包含在标记中，如下所示。恕我直言，您不必在面包屑中包含当前页面，因为 SERP 无论如何都会指向当前页面。从比当前页面高一级的位置提供面包屑是有意义的。希望这可以帮助。顺便说一句，我们已经在我们的组织中做到了。

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

Answer 2

解决方法是使用 <meta> 标签。

因此，面包屑中的最后一项应如下所示：

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title">CURRENT TITLE</span> <meta itemprop="url" content="CURRENT URL" /> </div>

这将在 Google testing tool 上进行验证并实现构建有效面包屑的预期目标，而不会 "displaying" 冗余 link。

供参考：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.

为了完整起见，必须添加 Google SERP 的正确格式面包屑，根据他们当前的 specs，您的示例代码应如下所示：

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

还请记住，Google 面包屑文档很快就要审核了，因为看起来 Google 终于采用了 schema.org 面包屑标记可以从官方Google网站管理员中心博客中的“Better presentation of URLs in search results”post和讨论中推断出来。

当前页面上的面包屑

Breadcrumbs on current page

html

seo

breadcrumbs

microdata

google-rich-snippets