The right micro-sized bread crumbs?
Faced with a lack of understanding of the semantics of the structure of creating breadcrumbs with micro-markup. There is such a structure.
<ul class='bl_breadcrumbs' itemscope itemtype='https://schema.org/BreadcrumbList'>
<li itemprop='itemListElement' itemscope itemtype='https://schema.org/ListItem'>
<a itemtype='https://schema.org/Thing' itemprop='item' href='/'><span itemprop='name'>Главная</span></a>
<meta itemprop='position' content='1'>
</li>
<li class='uk-active' itemprop='itemListElement' itemscope itemtype='https://schema.org/ListItem'>
<a itemtype='https://schema.org/Thing' itemprop='item' href='/NetGame-Entertainment' title='NetGame Entertainment'><span itemprop='name'>NetGame Entertainment</span></a>
<meta itemprop='position' content='2'>
</li>
<li class='uk-active' itemprop='itemListElement' itemscope itemtype='https://schema.org/ListItem'>
<a itemtype='https://schema.org/Thing' itemprop='item' href='/Golden-skulls' title=''><span itemprop='name'>Golden skulls</span></a>
<meta itemprop='position' content='3'>
</li>
</ul>According to tests from Google BreadcrumbList is compiled correctly. But if you start reading the recommendations that say it is "undesirable" to wrap the last element of bread crumbs in a link tag (the whole schema org breaks), again, if you check this piece of html through the W3C validator, then it also tells me that I'm wrong.
Tell me, please, is there a way to get rid of errors in the W3C validator and not break the micro-markup by passing the tests?
2 answers
W3C validator swore at missing attributes itemscope.
I added them so that the validation was successful, in the tags <ul> and <a>.
Also for correct markup validation schema.org it was necessary to add id to the tag <a>.
In production, the id of the page/record to which the link leads is used, the id means UUID, id, url, slug, it is best to use a relative path (I also recommend using a relative path and in href)
<ul class='bl_breadcrumbs' itemscope itemtype='https://schema.org/BreadcrumbList'>
<li itemprop='itemListElement' itemscope itemtype='https://schema.org/ListItem'>
<a itemtype='https://schema.org/Thing' itemscope itemprop='item' id='/' href='/'>
<span itemprop='name'>Главная</span>
</a>
<meta itemprop='position' content='1'>
</li>
<li class='uk-active' itemprop='itemListElement' itemscope itemtype='https://schema.org/ListItem'>
<a itemtype='https://schema.org/Thing' itemscope itemprop='item' id='NetGame-Entertainment' href='/NetGame-Entertainment' title='NetGame Entertainment'>
<span itemprop='name'>NetGame Entertainment</span>
</a>
<meta itemprop='position' content='2'>
</li>
<li class='uk-active' itemprop='itemListElement' itemscope itemtype='https://schema.org/ListItem'>
<!-- Здесь заменяем <a> на <span>, чтобы убрать ссылку на себя -->
<span itemtype='https://schema.org/Thing' itemscope itemprop='item' id='Golden-skulls' title=''>
<span itemprop='name'>Golden skulls</span>
</span>
<meta itemprop='position' content='3'>
</li>
</ul>
Probably the W3 validator swears at the fact that your markup on uses a microdata element such as itemscope, for example:
<a itemtype='https://schema.org/Thing' itemprop='item' href='/'>
Check the following information from Schema documentation:
When you add an itemscope, you specify that the HTML contained in the source code block refers to a specific element.
You specified this element when implementing the BreadcrumbList and ListItem types, but you ignore this element for the Thing type.