面包屑导航 (`BreadcrumbList`) 结构化数据

网页上的面包屑导航路径指明了网页在网站层次结构中的位置，有助于用户有效地了解和探索网站。用户可从面包屑导航路径中的最低层级开始，一次一个层级地导航到网站层次结构中的最高层级。

某网页上显示的面包屑导航 — 注意：在 Google 搜索结果中的实际显示效果可能会有不同。您可以使用富媒体搜索结果测试来预览大多数功能。

How to add structured data

Structured data is a standardized format for providing information about a page and classifying the page content. If you're new to structured data, you can learn more about how structured data works.

Here's an overview of how to build, test, and release structured data.

Add the required properties. Based on the format you're using, learn where to insert structured data on the page.
Using a CMS? It may be easier to use a plugin that's integrated into your CMS.
Using JavaScript? Learn how to generate structured data with JavaScript.
Follow the guidelines.
Validate your code using the Rich Results Test and fix any critical errors. Consider also fixing any non-critical issues that may be flagged in the tool, as they can help improve the quality of your structured data (however, this isn't necessary to be eligible for rich results).
Deploy a few pages that include your structured data and use the URL Inspection tool to test how Google sees the page. Be sure that your page is accessible to Google and not blocked by a robots.txt file, the noindex tag, or login requirements. If the page looks okay, you can ask Google to recrawl your URLs.
Note: Allow time for re-crawling and re-indexing. Remember that it may take several days after publishing a page for Google to find and crawl it.
To keep Google informed of future changes, we recommend that you submit a sitemap. You can automate this with the Search Console Sitemap API.

示例

Google 搜索使用网页正文中的面包屑导航标记在搜索结果中对来自该网页的信息进行分类。如以下用例所示，用户往往可通过各种不同类型的搜索查询到达同一个网页。虽然每次搜索可能会返回相同的网页，但面包屑导航会根据 Google 搜索查询的上下文对内容进行分类。网页 ancillaryjustice.html 可能会显示以下面包屑导航路径，具体取决于搜索上下文。

单个面包屑导航路径

以“2014 年星云奖最佳小说”奖项为例。这一包含了年份和体裁的搜索查询可能会生成以下面包屑导航：

图书 › 科幻小说 › 获奖作品

JSON-LD

下面是支持该面包屑导航的 JSON-LD 示例：

<html>
  <head>
    <title>Award Winners</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Books",
        "item": "https://example.com/books"
      },{
        "@type": "ListItem",
        "position": 2,
        "name": "Science Fiction",
        "item": "https://example.com/books/sciencefiction"
      },{
        "@type": "ListItem",
        "position": 3,
        "name": "Award Winners"
      }]
    }
    </script>
  </head>
  <body>
  </body>
</html>

RDFa

下面是支持该面包屑导航的 RDFa 示例：

<html>
  <head>
    <title>Award Winners</title>
  </head>
  <body>
    <ol vocab="https://schema.org/" typeof="BreadcrumbList">
      <li property="itemListElement" typeof="ListItem">
        <a property="item" typeof="WebPage"
            href="https://example.com/books">
          <span property="name">Books</span></a>
        <meta property="position" content="1">
      </li>
      ›
      <li property="itemListElement" typeof="ListItem">
        <a property="item" typeof="WebPage"
            href="https://example.com/books/sciencefiction">
          <span property="name">Science Fiction</span></a>
        <meta property="position" content="2">
      </li>
      ›
      <li property="itemListElement" typeof="ListItem">
        <span property="name">Award Winners</span>
        <meta property="position" content="3">
      </li>
    </ol>
  </body>
</html>

微数据

下面是支持该面包屑导航的微数据示例：

<html>
  <head>
    <title>Award Winners</title>
  </head>
  <body>
    <ol itemscope itemtype="https://schema.org/BreadcrumbList">
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <a itemprop="item" href="https://example.com/books">
            <span itemprop="name">Books</span></a>
        <meta itemprop="position" content="1" />
      </li>
      ›
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <a itemscope itemtype="https://schema.org/WebPage"
           itemprop="item" itemid="https://example.com/books/sciencefiction"
           href="https://example.com/books/sciencefiction">
          <span itemprop="name">Science Fiction</span></a>
        <meta itemprop="position" content="2" />
      </li>
      ›
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <span itemprop="name">Award winners</span>
        <meta itemprop="position" content="3" />
      </li>
    </ol>
  </body>
</html>

HTML

下面的示例展示了如何以融入视觉设计的方式，在网页中插入 HTML 面包屑导航块。

<html>
  <head>
    <title>Award Winners</title>
  </head>
  <body>
    <ol>
      <li>
        <a href="https://www.example.com/books">Books</a>
      </li>
      <li>
        <a href="https://www.example.com/sciencefiction">Science Fiction</a>
      </li>
      <li>
        Award Winners
      </li>
    </ol>
  </body>
</html>

多个面包屑导航路径

如果用户可以通过多种方式转到您网站上的某个网页，您可以为单个网页指定多个面包屑导航路径。以下是一个能够转到获奖图书页面的面包屑导航路径：

图书 › 科幻小说 › 获奖作品

以下是转到同一网页的另一个面包屑导航路径：

文学 › 获奖作品

JSON-LD

下面是支持多个面包屑导航路径的 JSON-LD 示例：

<html>
  <head>
    <title>Award Winners</title>
    <script type="application/ld+json">
    [{
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Books",
        "item": "https://example.com/books"
      },{
        "@type": "ListItem",
        "position": 2,
        "name": "Science Fiction",
        "item": "https://example.com/books/sciencefiction"
      },{
        "@type": "ListItem",
        "position": 3,
        "name": "Award Winners"
      }]
    },
    {
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Literature",
        "item": "https://example.com/literature"
      },{
        "@type": "ListItem",
        "position": 2,
        "name": "Award Winners"
      }]
    }]
    </script>
  </head>
  <body>
  </body>
</html>

RDFa

下面是支持多个面包屑导航路径的 RDFa 示例：

<html>
 <head>
 <title>Award Winners</title>
 </head>
 <body>
 <ol vocab="https://schema.org/" typeof="BreadcrumbList">
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/books">
 Books</a>
 <meta property="position" content="1">
 </li>
 ›
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/books/sciencefiction">
 Science Fiction</a>
 <meta property="position" content="2">
 </li>
 ›
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/books/sciencefiction/awardwinners">
 Award Winners</a>
 <meta property="position" content="3">
 </li>
 </ol>
 <ol vocab="https://schema.org/" typeof="BreadcrumbList">
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/literature">
 Literature</a>
 <meta property="position" content="1">
 </li>
 ›
 <li property="itemListElement" typeof="ListItem">
 Award Winners
 <meta property="position" content="2">
 </li>
 </ol>
 </body>
</html>

<html>
  <head>
    <title>Award Winners</title>
  </head>
  <body>
    <ol vocab="https://schema.org/" typeof="BreadcrumbList">
      <li property="itemListElement" typeof="ListItem">
        <a property="item" typeof="WebPage"
            href="https://example.com/books">
          <span property="name">Books</span></a>
        <meta property="position" content="1">
      </li>
      ›
      <li property="itemListElement" typeof="ListItem">
        <a property="item" typeof="WebPage"
            href="https://example.com/books/sciencefiction">
          <span property="name">Science Fiction</span></a>
        <meta property="position" content="2">
      </li>
      ›
      <li property="itemListElement" typeof="ListItem">
        <a property="item" typeof="WebPage"
            href="https://example.com/books/sciencefiction/awardwinners">
          <span property="name">Award Winners</span></a>
        <meta property="position" content="3">
      </li>
    </ol>
    <ol vocab="https://schema.org/" typeof="BreadcrumbList">
      <li property="itemListElement" typeof="ListItem">
        <a property="item" typeof="WebPage"
            href="https://example.com/literature">
          <span property="name">Literature</span></a>
        <meta property="position" content="1">
      </li>
      ›
      <li property="itemListElement" typeof="ListItem">
        <span property="name">Award Winners</span>
        <meta property="position" content="2">
      </li>
    </ol>
  </body>
</html>

微数据

下面是支持多个面包屑导航路径的微数据示例：

<html>
 <head>
 <title>Award Winners</title>
 </head>
 <body>
 <ol itemscope itemtype="https://schema.org/BreadcrumbList">
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemprop="item" href="https://example.com/books">
 Books</a>
 <meta itemprop="position" content="1" />
 </li>
 ›
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemscope itemtype="https://schema.org/WebPage"
 itemprop="item" itemid="https://example.com/books/sciencefiction"
 href="https://example.com/books/sciencefiction">
 Science Fiction</a>
 <meta itemprop="position" content="2" />
 </li>
 ›
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemprop="item" href="https://example.com/books/sciencefiction/awardwinners">
 Award Winners</a>
 <meta itemprop="position" content="3" />
 </li>
 </ol>
 <ol itemscope itemtype="https://schema.org/BreadcrumbList">
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemprop="item" href="https://example.com/literature">
 Literature</a>
 <meta itemprop="position" content="1" />
 </li>
 ›
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 Award Winners
 <meta itemprop="position" content="2" />
 </li>
 </ol>
 </body>
</html>

<html>
  <head>
    <title>Award Winners</title>
  </head>
  <body>
    <ol itemscope itemtype="https://schema.org/BreadcrumbList">
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <a itemprop="item" href="https://example.com/books">
            <span itemprop="name">Books</span></a>
        <meta itemprop="position" content="1" />
      </li>
      ›
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <a itemscope itemtype="https://schema.org/WebPage"
           itemprop="item" itemid="https://example.com/books/sciencefiction"
           href="https://example.com/books/sciencefiction">
          <span itemprop="name">Science Fiction</span></a>
        <meta itemprop="position" content="2" />
      </li>
      ›
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <a itemprop="item" href="https://example.com/books/sciencefiction/awardwinners">
          <span itemprop="name">Award Winners</span></a>
        <meta itemprop="position" content="3" />
      </li>
    </ol>
    <ol itemscope itemtype="https://schema.org/BreadcrumbList">
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <a itemprop="item" href="https://example.com/literature">
          <span itemprop="name">Literature</span></a>
        <meta itemprop="position" content="1" />
      </li>
      ›
      <li itemprop="itemListElement" itemscope
          itemtype="https://schema.org/ListItem">
        <span itemprop="name">Award Winners</span>
        <meta itemprop="position" content="2" />
      </li>
    </ol>
  </body>
</html>

HTML

下面的示例展示了如何以融入视觉设计的方式，在网页中插入 HTML 面包屑导航块。

<html>
  <head>
    <title>Award Winners</title>
  </head>
  <body>
    <ol>
      <li>
        <a href="https://www.example.com/books">Books</a>
      </li>
      <li>
        <a href="https://www.example.com/books/sciencefiction">Science Fiction</a>
      </li>
      <li>
        Award Winners
      </li>
    </ol>
    <ol>
      <li>
        <a href="https://www.example.com/literature">Literature</a>
      </li>
      <li>
        Award Winners
      </li>
    </ol>
  </body>
</html>

指南

您的内容必须遵循以下指南，才能在 Google 搜索结果中显示面包屑导航。

我们建议您提供代表网页的典型用户路径的面包屑导航，而不是直接照搬网址结构。网址路径的某些部分无法帮助用户了解网页在网站上的位置。例如，在 https://example.com/pages/books/catcher_in_the_rye.html 这个网址中，网址中的 pages 路径和顶级元素 example.com 均未传达任何位置信息。

结构化数据类型定义

如需指定面包屑导航，请定义一个包含至少两个 ListItems 的 BreadcrumbList。您的内容必须包含必要属性，才能在搜索结果中一并显示面包屑导航。

`BreadcrumbList`

BreadcrumbList 是用于存放列表中所有元素的容器项。如需了解 BreadcrumbList 的完整定义，请访问 schema.org/BreadcrumbList。 Google 支持的属性如下：

必需的属性

必需的属性
`itemListElement`	`ListItem` 以特定顺序列出的面包屑导航数组。使用 `ListItem` 指定每个面包屑导航。例如： { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Books", "item": "https://example.com/books" },{ "@type": "ListItem", "position": 2, "name": "Authors", "item": "https://example.com/books/authors" },{ "@type": "ListItem", "position": 3, "name": "Ann Leckie", "item": "https://example.com/books/authors/annleckie" }] }

itemListElement

ListItem

以特定顺序列出的面包屑导航数组。使用 ListItem 指定每个面包屑导航。例如：

{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
  "itemListElement": [{
    "@type": "ListItem",
    "position": 1,
    "name": "Books",
    "item": "https://example.com/books"
  },{
    "@type": "ListItem",
    "position": 2,
    "name": "Authors",
    "item": "https://example.com/books/authors"
  },{
    "@type": "ListItem",
    "position": 3,
    "name": "Ann Leckie",
    "item": "https://example.com/books/authors/annleckie"
  }]
}

`ListItem`

ListItem 包含列表中单个项的详细信息。如需了解 ListItem 的完整定义，请访问 schema.org/ListItem。 Google 支持的属性如下：

必需的属性

必需的属性
`item`	`URL`，或 `Thing` 的子类型表示面包屑导航的网页的网址。您可以通过以下两种方式指定 `item`： `URL`：指定网页的网址。例如： "item": "https://example.com/books" `Thing`：根据您正在使用的标记格式使用 ID 指定网址： JSON-LD：使用 `@id` 指定网址。微数据：使用 `href` 或 `itemid` 指定网址。 RDFa：使用 `about`、`href` 或 `resource` 指定网址。如果面包屑导航是面包屑导航路径中的最后一项，则无需指定 `item`。如果未针对最后一项指定 `item`，Google 会使用包含相应内容的网页对应的网址。
`name`	`Text` 向用户显示的面包屑导航的标题。如果您使用包含 `name` 的 `Thing`（而非 `URL`）指定 `item`，则无需指定 `name`。
`position`	`Integer` 面包屑导航在面包屑导航路径中的位置。位置 1 表示路径的开头。

item

URL，或 Thing 的子类型

表示面包屑导航的网页的网址。您可以通过以下两种方式指定 item：

URL：指定网页的网址。例如：
```
"item": "https://example.com/books"
```
Thing：根据您正在使用的标记格式使用 ID 指定网址：
- JSON-LD：使用 @id 指定网址。
- 微数据：使用 href 或 itemid 指定网址。
- RDFa：使用 about、href 或 resource 指定网址。

如果面包屑导航是面包屑导航路径中的最后一项，则无需指定 item。如果未针对最后一项指定 item，Google 会使用包含相应内容的网页对应的网址。

name

Text

向用户显示的面包屑导航的标题。如果您使用包含 name 的 Thing（而非 URL）指定 item，则无需指定 name。

position

Integer

面包屑导航在面包屑导航路径中的位置。位置 1 表示路径的开头。

Monitor rich results with Search Console

Search Console is a tool that helps you monitor how your pages perform in Google Search. You don't have to sign up for Search Console to be included in Google Search results, but it can help you understand and improve how Google sees your site. We recommend checking Search Console in the following cases:

After deploying structured data for the first time
After releasing new templates or updating your code
Analyzing traffic periodically

After deploying structured data for the first time

After Google has indexed your pages, look for issues using the relevant Rich result status report. Ideally, there will be an increase of valid items, and no increase in invalid items. If you find issues in your structured data:

Fix the invalid items.
Inspect a live URL to check if the issue persists.
Request validation using the status report.

After releasing new templates or updating your code

When you make significant changes to your website, monitor for increases in structured data invalid items.

If you see an increase in invalid items, perhaps you rolled out a new template that doesn't work, or your site interacts with the existing template in a new and bad way.
If you see a decrease in valid items (not matched by an increase in invalid items), perhaps you are no longer embedding structured data in your pages. Use the URL Inspection tool to learn what is causing the issue.

Analyzing traffic periodically

Analyze your Google Search traffic using the Performance Report. The data will show you how often your page appears as a rich result in Search, how often users click on it and what is the average position you appear on search results. You can also automatically pull these results with the Search Console API.

问题排查

如果您在实施或调试结构化数据时遇到问题，请查看下面列出的一些实用资源。

如果您使用了内容管理系统 (CMS) 或其他人负责管理您的网站，请向其寻求帮助。请务必向其转发列明问题细节的任何 Search Console 消息。
Google 不能保证使用结构化数据的功能一定会显示在搜索结果中。如需查看导致 Google 无法将您的内容显示为富媒体搜索结果的各种常见原因，请参阅结构化数据常规指南。
您的结构化数据可能存在错误。请参阅结构化数据错误列表。
如果您的网页受到结构化数据手动操作的影响，其中的结构化数据将会被忽略（但该网页仍可能会出现在 Google 搜索结果中）。如需修正结构化数据问题，请使用“人工处置措施”报告。
再次查看相关指南，确认您的内容是否未遵循指南。问题可能是因为出现垃圾内容或使用垃圾标记导致的。不过，问题可能不是语法问题，因此富媒体搜索结果测试无法识别这些问题。
针对富媒体搜索结果缺失/富媒体搜索结果总数下降进行问题排查。
请等待一段时间，以便 Google 重新抓取您的网页并重新将其编入索引。请注意，网页发布后，Google 可能需要几天时间才会找到和抓取该网页。有关抓取和索引编制的常见问题，请参阅 Google 搜索抓取和索引编制常见问题解答。
在 Google 搜索中心论坛中发帖提问。

面包屑导航 (BreadcrumbList) 结构化数据

How to add structured data

示例

单个面包屑导航路径

JSON-LD

RDFa

微数据

HTML

多个面包屑导航路径

JSON-LD

RDFa

微数据

HTML

指南

结构化数据类型定义

BreadcrumbList

ListItem

Monitor rich results with Search Console

After deploying structured data for the first time

After releasing new templates or updating your code

Analyzing traffic periodically

问题排查

面包屑导航 (`BreadcrumbList`) 结构化数据

`BreadcrumbList`

`ListItem`