web-dev-qa-db-ja.com

Schema.org-階層レイアウトですか、それとも疎レイアウトですか?

Schema.orgを使用してWebショップの製品ページにタグを付けています。これまで、bodyタグがItemPageとしてマークされている階層構造を使用しました。次に、パンくずリストにbreadcrumbのプロパティItemPageと、mainEntityである別のプロパティProductを使用できます。 構造化データテストツール で警告が表示されない.

しかし、GoogleがProduct内にバンドルされていなければ、Offer/ItemPageマークアップを簡単に選択できるのではないかと思います。つまり、ItemPageをスキップして、Productをブレッドクラムやその他のItemListとともにルーズな要素として持つ必要がありますか?

どちらが良いですか?

階層レイアウトの例:

<body itemscope itemtype="http://schema.org/ItemPage">
    <div>Some other stuff...</div>
    <ol itemprop="breadcrumb" itemscope itemtype="http://schema.org/BreadcrumbList">
        <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
            <a href="/a" itemprop="item"><span itemprop="name">A</span></a>
        </li>
        <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
            <a href="/b" itemprop="item"><span itemprop="name">B</span></a>
        </li>
    </ol>
    <div itemprop="mainEntity" itemscope itemtype="http://schema.org/Product">
        <img src="/image.jpg" itemprop="image">
        <h1 itemprop="name">My Product</h1>
        <div itemprop="description">Example text</div>
        <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
            <meta itemprop="price" content="129">
            <meta itemprop="priceCurrency" content="SEK">
            <link itemprop="availability" href="http://schema.org/InStock">
            <meta itemprop="itemCondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/NewCondition">
        </div>
    </div>
</body>

緩いタグ付けの例:(BreadcrumbListとProductは、「itemprop」ではありません)

<body>
    <div>Some other stuff...</div>
    <ol itemscope itemtype="http://schema.org/BreadcrumbList">
        <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
            <a href="/a" itemprop="item"><span itemprop="name">A</span></a>
        </li>
        <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
            <a href="/b" itemprop="item"><span itemprop="name">B</span></a>
        </li>
    </ol>
    <div itemscope itemtype="http://schema.org/Product">
        <img src="/image.jpg" itemprop="image">
        <h1 itemprop="name">My Product</h1>
        <div itemprop="description">Example text</div>
        <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
            <meta itemprop="price" content="129">
            <meta itemprop="priceCurrency" content="SEK">
            <link itemprop="availability" href="http://schema.org/InStock">
            <meta itemprop="itemCondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/NewCondition">
        </div>
    </div>
</body>
5
Truls

階層レイアウトの例は、公式のプロトコルドキュメントで提案されているmainEntityプロパティの推奨される使用法に非常に近いものです。

mainEntity definition "あるページで説明されているプラ​​イマリエンティティを示します"、これはあなたのケースにぴったりです、私の提案は、このよく構造化されたコードを選択することです。Googleはそれを完全に理解する必要があります。

これは、schema.orgメインプロパティで使用されるこの例に関連するコードです。

<body itemscope itemtype="http://schema.org/WebPage">
...
<div itemprop="breadcrumb">
  <a href="category/books.html">Books</a> >
  <a href="category/books-literature.html">Literature & Fiction</a> >
  <a href="category/books-classics">Classics</a>
</div>
<div itemprop="mainEntity" itemscope itemtype="http://schema.org/Book">
<img itemprop="image" src="catcher-in-the-rye-book-cover.jpg"
     alt="cover art: red horse, city in background"/>
<span itemprop="name">The Catcher in the Rye</span> -
 <link itemprop="bookFormat" href="http://schema.org/Paperback">Mass Market Paperback
by <a itemprop="author" href="/author/jd_salinger.html">J.D. Salinger</a>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
  <span itemprop="ratingValue">4</span> stars -
  <span itemprop="reviewCount">3077</span> reviews
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
  Price: $<span itemprop="price">6.99</span>
  <meta itemprop="priceCurrency" content="USD" />
  <link itemprop="availability" href="http://schema.org/InStock">In Stock
</div>
Product details
<span itemprop="numberOfPages">224</span> pages
Publisher: <span itemprop="publisher">Little, Brown, and Company</span> -
 <meta itemprop="datePublished" content="1991-05-01">May 1, 1991
Language: <span itemprop="inLanguage">English</span>
ISBN-10: <span itemprop="isbn">0316769487</span>
</div>
...
</body>

上記の例とあなたの例は、両方とも https://search.google.com/structured-data/testing-tool によって完全に処理されており、非常に類似した結果が得られています。

2
marcanuy