Structured breadcrumb trail data-vocabulary.org schema deprecated How to fix errors

The other day, it seems that many emails have arrived from the Google Search Console under the title "A new problem with the" breadcrumb trail "has been detected."

This time I would like to explain this correspondence.

Email content from Google Search Console

The contents of the emails received on many sites this time are as follows.

Email screenshot

The Search Console has detected one "breadcrumb trail" related issue that affects your site.
Main warnings
Warnings are recommendations for improving your site. Depending on the warning, the display in the search results may be affected. It is also possible that the warning will result in an error in the future. The following warnings have been detected on your site:
data-vocabulary.org schema deprecated
We recommend that you resolve the above issues as much as possible. By eliminating these issues, you can optimize your site's experience and display in Google search results.

It looks like something dangerous, but I'm the only one who gets surprised when it says "warning" (laughs).

The cause is structured data

Google announced on February 21, 2020Stop displaying rich results by data-vocabulary.orgI made an announcement.
The end of support for data-vocabulary.org is April 6, 2020.

Sunsetting support for data-vocabulary
Official news on crawling and indexing sites for the Google index

Structured data is a markup method used by robots such as search engines to understand the meaning of content and its strings.
data-vocabulary.org is one of the markup methods for structured data, and it was an old way to mark up.

This time around, Google is ending with using this as a hint for displaying rich results.

Google may use structured data as a reference to create a special display in search results called "rich results."
For details, please see Google's official page, but there are various display methods such as word-of-mouth stars, thumbnail images, breadcrumbs and carousel display.

What is a rich result! Please check it.

Enable search results for your site | Search Central | Google Developers

As a workaround, migration to Schema.org is required

This time, we will stop using data-vocabulary.org by the end of support date. Migrate to Schema.orgI want you to do it.

Schema.org is another way to mark up structured data, but it's the most popular method at the moment.

You need to remove the data-vocabulary.org in the HTML of your site and modify it to the Schema.org description.

What to think if you do not respond

What happens if you don't respond to changes from data-vocabulary.org to Schema.org?

If you keep the structured data as data-vocabulary.org and you have benefited from the rich result display, it may return to the normal display.

How much this will affect the influx of websites will vary depending on the situation,CTR may drop as it becomes less noticeable in search resultsIt will be considered.

You should deal with it as much as possible.

Specific correction method

This time, when I checked the breadcrumb trail page of the Google Search Console of the site that received the warning email, the message "data-vocabulary.org schema deprecated" was displayed.

Error on search console

When I checked the source code, the following description was found.

data-vocabulary.org breadcrumb trail source code
<ul> <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="https://example.com" itemprop="url"> <span itemprop="title">ホーム</span> </a> </li> <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title">サービス</span> </li> </ul>
Code language: HTML, XML (xml)

It says itemtype = ”http://data-vocabulary.org/Breadcrumb” and you can see that data-vocabulary.org is used.

This is how schema.org is written.

Modified breadcrumb trail source code on Schema.org
<ol itemscope itemtype="http://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a itemprop="item" href="https://example.com"> <span itemprop="name">ホーム</span> </a> <meta itemprop="position" content="1" /> </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <span itemprop="name">サービス</span> <meta itemprop="position" content="2" /> </li> </ol>
Code language: HTML, XML (xml)

It's a little difficult.

If possible, it is recommended to implement it using the JSON-LD description method.

There is also a way to write structured data called JSON-LD, which is actually Google recommends writing in JSON-LD.

Understand How Structured Data Works | Google Search Central
Google uses structured data to understand content. Explore this guide to discover how structured data works, review form…

There are three ways to describe structured data: Microdata, RDFa, and JSON-LD. With JSON-LD, there is no need to insert structured data in HTML tags, and it is easy to introduce structured data. Will be.

The description method in JSON-LD is as follows.

JSON-LD breadcrumb trail source code
<ul> <li> <a href="https://example.com">ホーム</a> </li> <li>サービス</li> </ul> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "item": { "@id": "https://example.com", "name": "ホーム", "image": "http://example.com/images/icon-home.png" } },{ "@type": "ListItem", "position": 2, "item": { "@id": "https://example.com/service", "name": "サービス", "image": "http://example.com/images/icon-service.png" } },{ <p>中略</script>
Code language: HTML, XML (xml)

In this way, HTML and structured data are written separately, so it seems easy to insert and maintain.

How to mark up a breadcrumb trail using JSON-LD in WordPress

If you're using WordPress, it's relatively easy to implement structured data markup in JSON-LD.
Generally, in the theme file footer.php, You can implement it by pasting the corresponding code just before (end tag of body).

I will share the code used on this site, but it is very easy because this one code can be used on all pages.

Breadcrumb trail source code for WordPress JSON-LD
<!-- パンくず構造化 --> <?php $catarg = get_the_category(); $catname = $catarg[0]->name; $catslug = $catarg[0]->slug; ?> <?php if(is_home()): ?> <?php elseif(is_archive()): ?> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "item": { "@id": "<?php echo site_url(); ?>", "name": "HOME" } }, { "@type": "ListItem", "position": 2, "item": { "@id": "<?php echo site_url().'/'.$catslug; ?>", "name": "<?php echo $catname; ?>" } } ] } </script> <?php elseif(is_single()): ?> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "item": { "@id": "<?php echo site_url(); ?>", "name": "HOME" } } , { "@type": "ListItem", "position": 2, "item": { "@id": "<?php echo site_url().'/'.$catslug; ?>", "name": "<?php echo $catname; ?>" } } , { "@type": "ListItem", "position": 3, "item": { "@id": "<?php echo post_permalink(); ?>", "name": "<?php echo get_the_title(); ?>" } } ] } </script> <?php elseif(is_page()): ?> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "item": { "@id": "<?php echo site_url(); ?>", "name": "HOME" } }, { "@type": "ListItem", "position": 2, "item": { "@id": "<?php echo post_permalink(); ?>", "name": "<?php echo get_the_title(); ?>" } } ] } </script> <?php endif; ?>
Code language: HTML, XML (xml)

I refer to the following sites.

[WordPress] How to mark up breadcrumbs with structured data in JSON-LD
Here's the code: Here's how to do structured data markup in "JSON-LD format" on a breadcrumb trail on a website made with WordPress. In the first place, if you are asking "What is structured data markup?", Google official document ...

Once you've made your changes, you can use the Rich Results Test or the Structured Data Testing Tool to verify your installation.

Rich Results Test-Google Search Console

In the rich result test, if the following error is not displayed, there is no problem.

Rich result test screenshot
Structured data testing tool

With the Structured Data Testing Tool, if you don't see the error below, it's okay.
(The structured data test tool is easier to understand, isn't it?)

Structured Data Testing Tool Screenshot

Please feel free to contact us if you have any questions.

I'm sure some of you may be worried when you suddenly receive a warning email.

Structured data is often more complex and confusing than past HTML markup.
I hope this article will be of some help to you.

If you have any questions after reading the article, feel free to Twitter (@kaznak_com) Etc., please ask.

see you.

Kazuhiro Nakamura
Kazuhiro Nakamura
Representative of Cocorograph Inc. 13 years of SEO history, more than 970 sites with countermeasures. We provide SUO, an upward compatible service of SEO that optimizes not only search engines but also search users. SEO / SUO's original report tool, Sachiko Report Developer. Book "The latest common sense of SEO taught by professionals in the field"
Kazuhiro Nakamura
Kazuhiro Nakamura
Representative of Cocorograph Inc. 13 years of SEO history, more than 970 sites with countermeasures. We provide SUO, an upward compatible service of SEO that optimizes not only search engines but also search users. SEO / SUO's original report tool, Sachiko Report Developer. Book "The latest common sense of SEO taught by professionals in the field"