Nascondi

Breadcrumbs

About breadcrumbs

Breadcrumb trails on a page indicate the page's position in the site hierarchy. A user can navigate all the way up in the site hierarchy, one level at a time, by starting from the last breadcrumb in the breadcrumb trail.

In the example below, the page thestand.html about a specific book may contain the following breadcrumb trail:

HomeBooksAuthorsStephen KingThe Stand

The last item in the breadcrumb trail - "The Stand" - leads to the page itself. The breadcrumb before that - "Stephen King" - leads to its parent page. The "Authors" breadcrumb leads two levels up the site hierarchy.

The breadcrumb trail may include or omit a breadcrumb for the page on which it appears. The following would also be a valid breadcrumb trail for thestand.html:

HomeBooksAuthorsStephen King

Pages may contain more than one breadcrumb trail if there is more than one way of representing a page's location in the site hierarchy. The page thestand.html may, for instance, additionally contain the following breadcrumb:

BooksFictionHorrorThe Stand

When you mark up breadcrumb information in the body of a web page, Google can use it to understand and present the information on your pages in our search results, like this:

image of a Google search result showing breadcrumbs

Properties

Breadcrumbs can contain a number of different properties which you can label using Microdata, RDFa markup, or JSON-LD. Google recognizes the following properties of a BreadcrumbList.

Property Description
item An individual breadcrumb in the breadcrumbs trail. It contains the URL and the title of the breadcrumb.
name The title of the breadcrumb.
position The position of the breadcrumb in the breadcrumbs trail. Position 1 signifies the beginning of the trail.

Examples

A breadcrumb trail may appear on a page like the following example:

ArtsBooksPoetry

The HTML code for the breadcrumb trail above may be:

<ol>
  <li>
    <a href="http://www.example.com/arts">Arts</a> ›
  </li>
  <li>
    <a href="http://www.example.com/arts/books">Books</a> ›
  </li>
  <li>
    <a href="http://www.example.com/arts/books/poetry">Poetry</a>
  </li>
<ol>

The following basic examples specify a breadcrumb trail using microdata, RDFa, and JSON-LD. In case of JSON-LD, the script block may be inserted anywhere on the page - either in the head or the body.

JSON-LD

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{
    "@type": "ListItem",
    "position": 1,
    "item": {
      "@id": "https://example.com/arts",
      "name": "Arts"
    }
  },{
    "@type": "ListItem",
    "position": 2,
    "item": {
      "@id": "https://example.com/arts/books",
      "name": "Books"
    }
  },{
    "@type": "ListItem",
    "position": 3,
    "item": {
      "@id": "https://example.com/arts/books/poetry",
      "name": "Poetry"
    }
  }]
}
</script>

JSON-LD -- multiple breadcrumb trails

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{
    "@type": "ListItem",
    "position": 1,
    "item": {
      "@id": "https://example.com/arts",
      "name": "Arts"
    }
  },{
    "@type": "ListItem",
    "position": 2,
    "item": {
      "@id": "https://example.com/arts/books",
      "name": "Books"
    }
  },{
    "@type": "ListItem",
    "position": 3,
    "item": {
      "@id": "https://example.com/arts/books/poetry",
      "name": "Poetry"
    }
  }]
}
</script>
<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{
    "@type": "ListItem",
    "position": 1,
    "item": {
      "@id": "https://example.com/literature",
      "name": "Literature"
    }
  },{
    "@type": "ListItem",
    "position": 2,
    "item": {
      "@id": "https://example.com/literature/poetry",
      "name": "Poetry"
    }
  }]
}
</script>

RDFa

<ol vocab="http://schema.org/" typeof="BreadcrumbList">
  <li property="itemListElement" typeof="ListItem">
    <a property="item" typeof="WebPage"
        href="https://example.com/arts">
      <span property="name">Arts</span></a>
    <meta property="position" content="1">
  </li>
  ›
  <li property="itemListElement" typeof="ListItem">
    <a property="item" typeof="WebPage"
        href="https://example.com/arts/books">
      <span property="name">Books</span></a>
    <meta property="position" content="2">
  </li>
  ›
  <li property="itemListElement" typeof="ListItem">
    <a property="item" typeof="WebPage"
        href="https://example.com/arts/books/poetry">
      <span property="name">Poetry</span></a>
    <meta property="position" content="3">
  </li>
</ol>

RDFa -- multiple breadcrumb trails

<ol vocab="http://schema.org/" typeof="BreadcrumbList">
  <li property="itemListElement" typeof="ListItem">
    <a property="item" typeof="WebPage"
        href="https://example.com/arts">
      <span property="name">Arts</span></a>
    <meta property="position" content="1">
  </li>
  ›
  <li property="itemListElement" typeof="ListItem">
    <a property="item" typeof="WebPage"
        href="https://example.com/arts/books">
      <span property="name">Books</span></a>
    <meta property="position" content="2">
  </li>
  ›
  <li property="itemListElement" typeof="ListItem">
    <a property="item" typeof="WebPage"
        href="https://example.com/arts/books/poetry">
      <span property="name">Poetry</span></a>
    <meta property="position" content="3">
  </li>
</ol>
<ol vocab="http://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">
    <a property="item" typeof="WebPage"
        href="https://example.com/literature/poetry">
      <span property="name">Poetry</span></a>
    <meta property="position" content="2">
  </li>
</ol>

Microdata

<ol itemscope itemtype="http://schema.org/BreadcrumbList">
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/arts">
        <span itemprop="name">Arts</span></a>
    <meta itemprop="position" content="1" />
  </li>
  ›
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/arts/books">
      <span itemprop="name">Books</span></a>
    <meta itemprop="position" content="2" />
  </li>
  ›
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/arts/books/poetry">
      <span itemprop="name">Poetry</span></a>
    <meta itemprop="position" content="3" />
  </li>
</ol>

Microdata -- multiple breadcrumb trails

<ol itemscope itemtype="http://schema.org/BreadcrumbList">
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/arts">
        <span itemprop="name">Arts</span></a>
    <meta itemprop="position" content="1" />
  </li>
  ›
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/arts/books">
      <span itemprop="name">Books</span></a>
    <meta itemprop="position" content="2" />
  </li>
  ›
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/arts/books/poetry">
      <span itemprop="name">Poetry</span></a>
    <meta itemprop="position" content="3" />
  </li>
</ol>
<ol itemscope itemtype="http://schema.org/BreadcrumbList">
  <li itemprop="itemListElement" itemscope
      itemtype="http://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="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/literature/poetry">
      <span itemprop="name">Poetry</span></a>
    <meta itemprop="position" content="2" />
  </li>
</ol>