【SEO】SEOを意識したパンクズリストの記述方法。

パンクズリストを作成するときに、下記の点に留意するとgoogleの検索結果に綺麗に反映される。

1, ul(リストタグ)を使用する

2, microdata形式の構造化マークアップを適用する

■構造化マークアップのやり方

1, liタグ内に「itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”」を記述

2, aタグ内に「itemprop=”url”」を記述。※現在見ている場所もaタグで囲うこと。

3, アンカーテキスト部分をspanで囲んで「itemprop=”title”」の属性を付与する

下記例。

<ul id="bread-crumb-list;>
  <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
    <a itemprop="url" href="http://www.example.com/"><span itemprop="title">TOP</span></a>&nbsp;&gt;&nbsp;
  </li>
  <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
    <a itemprop="url" href="http://www.example.com/category/"><span itemprop="title">カテゴリー</span></a>&nbsp;&gt;&nbsp;
  </li>
  <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
    <a itemprop="url" href="http://www.example.com/category/article"><span itemprop="title">記事</span></a>
  </li>
</ul>