Googleの検索結果にパンくずリストを表示させる方法!



Googleの検索結果には、通常ですと対象ページのURLが表記されますが、
Googleに対して、パンくず用の適したコーディングを行う事により、
リンク付のパンくずリストをGoogleの検索結果に表示する事が出来ます。
今回は、そんなパンくずリストの構築方法を解説します。


  1. パンくずリストの効果
  2. 正しいパンくずリストのマークアップ
  3. 正しくマークアップされたか確認する




パンくずリストの効果



Googleの検索結果では、通常ですと対象ページのURLが直接表示されます。





しかし、正しいマークアップを行う事により、検索結果にリンク付のパンくずリストとして
表示する事が可能です。





Googleの検索結果にパンくずリストを表示させると、単純に目立ってクリック率が上がる他、
正しいマークアップによる正しい情報をGoogleの検索エンジンに伝える事が出来るので、
SEO的にも有効です。
また、表示されたパンくずには、対象のページへのリンクも貼られますので、
検索結果から複数のページへ直接移動する事が出来、ユーザビリティも向上します。

パンくずリストは、導入のメリットは多々ありますが
デメリットは無いので、是非とも導入すべきでしょう。

こういったマークアップ記法は、今後更に重要となってきますので、
なるべく身に付けておきたい知識ですね。




正しいパンくずリストのマークアップ



Googleの検索結果にパンくずリストを表示させるには、
Googleに対してページの内容を正しく認識させる必要があります。
その為に、パンくずリストの表記として推奨されているマークアップ記法として
『microdata』と『RDFa』がありますが、今回は筆者も当ブログで使用している
『microdata』のマークアップ記法について解説します。

まず、『microdata』でGoogleが認識できるプロパティとして三種類用意されています。
いずれも、『itemprop』属性にて指定する事が可能で、内容の意図を正しく伝えるのに役立ちます。

プロパティ名 解説
title パンくずとして表示するタイトルです。
url パンくずの対象URLです。
child 次のパンくずアイテムを指定します。


では、具体的にパンくずリストのマークアップを見てみましょう。





上記は、実際に当ブログで使用しているコードを抜粋したものです。
『itemscope』や『itemtype』、『itemprop』が属性として使用されていますが、
『itemscope』は『itemtype』で指定されているものの対象範囲が『itemscope』内で有る事を示し、
『itemprop』は、先程表記したプロパティを指定します。
『itemprop='title'』とすれば、それがパンくずのタイトルに当たるとGoogleが認識し、
『itemprop='url'』とすれば、それがパンくずのURLに当たるとGoogleが認識してくれます。

『itemtype』には『http://data-vocabulary.org/Breadcrumb』を指定し、
『itemscope』には『itemscope』を指定しましょう。



 
  
 


そして、次のパンくずへは『>』や『>>』『:』等、
お好きな区切り文字を使用して問題ありません。



また、上記マークアップを行っても、直ぐに検索結果に反映される訳では有りません。
反映されるタイミングは、Googleのクローラーが巡廻してきて、
尚且つGoogleのインデックスが更新されるタイミングです。

マークアップを行いましたら、たとえ直ぐに反映されなくても
あれこれ修正を加えるのではなく、ある程度の期間を置いて下さい。



正しくマークアップされたか確認する



マークアップを終えても、中々検索結果に反映されないと不安です。
その期間は待ち続けるしかないのですが、マークアップが正しく行えたのか?
何かミスがあるのではないか?と自問自答してしまうと思います。

そこで、そんな不安を少しでも解消する為に、
Googleが正しく認識出来るかどうかを調べる方法があります。

それには、『構造化データ テストツール』を使用します。





『構造化データ テストツール』
http://www.google.com/webmasters/tools/richsnippets



対象のURLを入力し、プレビューボタンを押すと、
検索結果でどの様に表示されるのかを確認する事が出来ます。

また、見た目上だけでなく、内容も正しく認識出来るか確認するには
ページの下方にあります『抽出された構造化データ』の『item』を確認して下さい。






パンくずとして指定したアイテムのタイプやプロパティが正しく認識されているか?
リンク先は正しいか等を確認し、正しければGoogleのクローラーが巡廻してくれば
正しく反映されるはずですので、気長に待ちましょう。

もし、何かしら意図したものと異なる結果が出ましたら、
なるべく早めに修正し、『構造化データ テストツール』での確認を繰り返して
正しくマークアップしましょう。


筆者の感覚としては、パンくずリストを導入してからアクセス数がグンっと
上がった感覚があります。
パンくずリストの導入にあたりデメリットは無く、メリットは沢山ありますので、
是非とも正しいマークアップを行い、導入してみて下さいね。


コメントをお待ちしています

人気の投稿

Category

Algorithm (2) Android (8) ASP/aspx (1) Blogger (2) C/C++ (1) Chrome (5) CSS (9) Firefox (4) Fortran (1) Google (9) GoogleMap (2) HTML (12) IE (3) Information (4) iOS (2) iPhone/iPad/iPod (2) Java (6) JavaScript (16) jQuery (9) JSP (1) LifeRecipe (5) Linux (2) Macintosh (2) MapKit (4) Marketing (7) MySQL (3) NAMAZU (2) Objective-C (7) Other (7) Perl (1) PHP (9) Python (1) RSS/Atom (2) Ruby (1) Safari (2) SEO (11) Smarty (2) SQL (2) Tex (1) Three.js (1) Twitter (1) TwitterLog (313) UIKit (5) Unix (1) VBA/VBS (1) Windows (5) WordPress (3) Writing (5) XAMPP (1) XML (1) Yahoo (2) ZendFramework2 (14)

Archives