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:
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
:
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:
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:
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:
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.<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>
No comments:
Post a Comment