SEOで注目されている「構造化マークアップ」を学んでみました。
microdataやmicroformats,RDFaを使用した「構造化マークアップ」
を行うことで、検索結果にマークアップした内容が表示されます。
これを「リッチスニペット」といい、例えば「パンくずリスト」などで、
【Googleで検索された表示例】
Kindle書籍アメリカ免除申請
www.pb-support.com > 電子書籍
4 日前 - kindleで電子書籍を出版すると、Amazon出版サービス(KDP)が
アメリカのサービスなのでそのロイヤルティには日本所得税10%の他、
アメリカ所得税30%で合計40%が源泉徴収されます。・・・・
のようにリッチスニペットにパンくずリストが表示されます。
microdataでは、タイプを指定する際にschema.orgやdata-vocaburaly
のようなボキャブラリを使うことになります。
schema.orgは、GoogleやYahoo、Bingなどの3大検索エンジンが
サポートするボキャブラリですが、schema.orgを使用してパンくずリストを
マークアップしても、リッチスニペットにパンくずリストが表示されません。
「data-vocaburalyを使用したパンくずリスト」を
MovaleTypeのブログで作ってみました。
<mt:If tag="EntryCategory"> <div class="entry-categories"> <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="<$mt:BlogURL$>" itemprop="url"> <span itemprop="title">トップ</span></a> > </span> <mt:IfNonEmpty tag="EntryCategory"> <MTParentCategories glue=" > "> <MTIfNonZero tag="CategoryCount"> <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="<$mt:CategoryArchiveLink$>" itemprop="url"> <span itemprop="title"><$mt:CategoryLabel pmhc=""$></span></a> > </span> <MTElse> <span itemprop="title"><$mt:CategoryLabel pmhc=""$></span> </MTElse> </MTIfNonZero> </MTParentCategories> </mt:IfNonEmpty> <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <span itemprop="title"><$mt:EntryTitle$></span> </span> </div> </mt:If> | ||
このようにdata-vocaburalyで作ると、Yahoo!でもGoogleでも
パンくずリストがきちんと検索結果に表示され、クリッカブルになっています。
クリッカブルされるまで、少し時間がかかりますが、
Google「構造化データ テスト ツール」を使うと、
Google 検索結果でのページのプレビューを表示することができます。