Fil d'Ariane à l'aide d'extraits enrichis de Schema.org

9

J'ai des problèmes pour implémenter les extraits riches en fil d'Ariane de schema.org. Lorsque je crée mon fil d' Ariane à l'aide de la documentation et que je l' exécute via l' outil de test Google Rich Snippet , le fil d' Ariane est identifié mais ne s'affiche pas dans l'aperçu.

<!DOCTYPE html>
<html>
  <head>
    <title>My Test Page</title>
  </head>
  <body itemscope itemtype="http://schema.org/WebPage">     
      <strong>You are here: </strong>
      <div itemprop="breadcrumb">
        <a title="Home" href="/">Home</a> >
        <a title="Test Pages" href="/Test-Pages/">Test Pages</a> >
      </div>
  </body>
</html>

Si je change pour utiliser les extraits de données de vocabulaire.org, les extraits riches s'affichent correctement dans l'aperçu.

<!DOCTYPE html>
<html>
  <head>
    <title>My Test Page</title>
  </head>
  <body>
      <strong>You are here: </strong>
      <ol itemprop="breadcrumb">
        <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
          <a href="/" itemprop="url">
            <span itemprop="title">Home</span>
          </a>
        </li>
        <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
          <a href="/Test-Pages/" itemprop="url">
            <span itemprop="title">Test Pages</span>
          </a>
        </li>
      </ol>
  </body>
</html>

Je souhaite que le fil d'Ariane soit affiché dans le résultat de la recherche plutôt que dans l'URL de la page.

Étant donné que Schema.org est la méthode recommandée pour utiliser des extraits enrichis, je préfère utiliser cela, mais comme le fil d'Ariane ne s'affiche pas dans l'aperçu des résultats de la recherche en utilisant cette méthode, je ne suis pas convaincu que cela fonctionne correctement.

Suis-je en train de faire quelque chose de mal dans l'exemple de balisage pour Schema.org?

— Adam Jenkin
source

Google recommande d'utiliser le format de microdonnées par rapport aux autres. Fil d'Ariane, ils prennent en charge les microdonnées et RDFa support.google.com/webmasters/bin/… J'utiliserais leur format recommandé si vous souhaitez qu'il apparaisse dans les résultats de recherche.

— Anagio

Connexes: Schema.org ou Data-Vocabulary.org pour le fil d'Ariane?

— unor

3

Avec cette implémentation:

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="http://www.example.com/dresses" itemprop="url">
    <span itemprop="title">Dresses</span>
  </a> &gt;
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses/real" itemprop="url">
    <span itemprop="title">Real Dresses</span>
  </a> &gt;
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/clothes/dresses/real/green" itemprop="url">
    <span itemprop="title">Real Green Dresses</span>
  </a>
</div>

Vous aurez le fil d'Ariane suivant dans Google:

Dresses > Real Dresses > Real Green Dresses

— Ranaivo
source

1

Je voudrais +1 pour votre référence Barenaked Ladies, mais malheureusement je pense que j'abuserais du système de vote :-) Alors je vais vous attribuer +1 pour une solution qui fonctionne réellement.

— Paul d'Aoust

1

Il me semble que le problème vient de la documentation schema.org elle-même. Voici quelques liens éducatifs:

J'ai classé ceux-ci comme les plus utiles en premier, essentiellement ils se relient tous éventuellement. L'action à ce sujet est prévue à la fin de ce mois, mais il semble que le résultat sera le même que dans votre deuxième exemple.

C'est dommage parce que le html finit par être plus compliqué qu'il ne devrait l'être, mais nous y sommes.

J'espère que cela pourra aider!

— Stuart Burrows
source

1

J'ai fait des recherches à ce sujet récemment.

Il s'avère que ce que Google recommande pour le fil d'Ariane ne fonctionne pas. Lorsque j'ai regardé il y a quelques semaines, leur propre exemple a échoué dans l'outil Rich Snippet de Google. Il semble que Google soit un peu en retard mais toujours en avance sur les autres.

Data-vocabulary.org est la norme acceptée et de facto bien que Schema.org l'aurait remplacé par Data-vocabulary.org comme étant déprécié. Cependant, la réalité ne correspond pas à la rhétorique. L'intention était que Schema.org remplacerait Data-vocabulary.org et il se peut que cela se produise. Pourtant, j'ai trouvé un extrait (jeu de mots voulu) quelque part qui mentionnait que Google n'avait pas encore modifié son code pour reconnaître Schema.org.

Cela dit, voici l'exemple que j'ai trouvé qui fonctionne dans Google et Bing, bien que Bing ait changé les choses un peu récemment, alors soyez prudent si Bing est important pour vous.

<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/"><span itemprop="title">Home</span></a> &gt; </span>
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/marvel/"><span itemprop="title">Marvel Comics</span></a> &gt; </span>
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/fantastic-four/"><span itemprop="title">Fantastic Four</span></a> &gt; </span>
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/fantastic-four/58/"><span itemprop="title">Fantastic Four #48: The Coming of Galactus</span></a></span>

J'espère que cela t'aides.

— placard
source

1

(Laissant de côté le soutien des consommateurs.)

Le vocabulaire Schema.org propose deux façons de fournir le fil d'Ariane pour un WebPage(et ses sous-types):

breadcrumbpropriété avec une valeur de texte
breadcrumbpropriété avec une BreadcrumbListvaleur

L'utilisation de texte est facile, mais non structurée (plus difficile à analyser pour les consommateurs).
L'utilisation BreadcrumbListest plus complexe, mais permet de spécifier explicitement tout ce qui est nécessaire (plus facile à analyser pour les consommateurs).

En prenant votre exemple, l'utilisation BreadcrumbListpourrait ressembler à ceci:

<body itemscope itemtype="http://schema.org/WebPage">     
  <strong>You are here: </strong>
  <div itemprop="breadcrumb" itemscope itemtype="http://schema.org/BreadcrumbList">

    <span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
      <meta itemprop="position" content="1" />
      <a itemprop="item" href="/">
        <span itemprop="name">Home</span>
      </a>
    </span> 

    &gt;

    <span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
      <meta itemprop="position" content="2" />
      <a itemprop="item" href="/Test-Pages/">
        <span itemprop="name">Test Pages</span>
      </a>
    </span>

  </div>
</body>

(Vous devrez peut-être déplacer des éléments si les espaces sont un problème.)

— unor
source