Blogの本文が検索されない原因を探ってみた(後編)

前編のdescription(要約)。

テンプレートを替えたところ、Googleの検索結果が実にわかりにくいものに。原因はどうやらすべてのページに設定されているmetaタグのdescription(要約)のようでした。とりあえず、原因になっていそうなところを修正・カスタマイズしてはみました。しかし、変更前のテンプレートとの比較検証がまだ終わってない上に、全ページに同じ要約が設定されていても問題なく検索結果が出てくるサイト(Blog)もあります。

本当に原因は要約なのか？他にテンプレートに手を入れるべきところはないのか？

悪戦苦闘はもう少し続きます。

HTMLのおさらいと<h>タグの扱い

HTMLはマークアップ言語の一つで、非常に簡単にいってしまえば「文章を意味づける」ための言語です。 タグにはそれぞれ意味があり、例えば<title>○○のブログ</title>なら「○○のブログ」がタイトルですよ、とHTMLを解釈するもの(一般的にはブラウザ)に理解させることができます。 当然これは検索クローラ(検索エンジン)も同じです。 (ただこのBlogのテンプレートはHTMLじゃなくXHTMLで書かれていますけど。)

<h>タグは見出しを意味していて、h1は「大見出し」なので一回しか使えません。Blogのテンプレートではサイトのタイトルと同じものが使われることが多いようですね。

h2、h3と数字が増えるごとに「中見出し」「小見出し」と重要度が下がっていき、タグとしてはh6まで使用することができます。 h1以外なら特に使用回数制限はありません。

さて、今のテンプレートを見るとh1～h5まで使われていて、役割はそれぞれ以下のようになっていました。

h1 - Blogタイトル
h2 - エントリの投稿日
h3 - エントリのタイトル、コメントの編集
h4 - コメント
h5 - 投稿されたコメントのタイトル

旧テンプレートのものはこうなっています。

h1 - Blogタイトル
h2 - Blogの説明文
h3 - エントリのタイトル、コメント、トラックバック
h4 - コメントのタイトル、トラックバックのタイトル

見たところ、使われている見出しのレベルや個数にかなりの違いがあるようです。一番目につくのは、旧テンプレートの方はh2でBlogの説明文が記述されており、新テンプレートはmetaタグのdescriptionで書いてあるというところでしょうか。別な点で気になるのは、h2はh1に続く重要な中見出しなのに両者とも重要なものには割り当てられてない感じですね。前出のとおり、旧テンプレートは説明文、新テンプレートでも日付という重要性があるのかないのか微妙な辺りにh2は使われていますから。

<h>タグの問題……なのだろうか？

前編でトップページ以外のdescriptionを表示させないようにして、個別のエントリには要約を入れたから問題ないんじゃないの？と思っている方もいるかもしれません。

しかし、話はそう簡単には終わりません。前編でも触れましたが、descriptionにBlog自体の説明を入れてすべてのページに挿入するのは珍しい仕様とはいえません。実際にそういうサイト(Blog)の作りになっているにも関わらず、検索結果に本文がきちんと表示されている例も山のようにあります。この辺りの違いもそれなりに納得できる形にしておきたいところです。

せっかく新旧テンプレートの<h>タグの違いに目を付けたのですから、きちんと表示されるBlogで<h>タグをどう使ってるか見てみました。というわけで、前編で触れた某超人気Blog二つのソースを穴が空くほど見てみると……。

h1 - Blogのタイトルで私のテンプレートと変わらない。
h2 - エントリのタイトルに使われている。
h3 - エントリ内の段落に使われている模様。
(段落がない場合は使われない？)
それ以下は色々。

といったようなことがわかりました。やっぱりh2をエントリタイトルに使う辺りがキモなのでしょうか？

■簡単に改造……できない

実際に効果があるかはわかりませんが、とりあえず有効そうなら試してみようということでh2をエントリタイトルに割り当ててみましょう。h2が投稿日でh3がタイトルですから、そのまま入れ替えれば問題なし……とはいきませんでした。

最初の方に書いたとおり、「hの後の数字」は見出しの大きさですから、基本的に小見出しの後に中見出しは置けません。このテンプレートは、最初からh2とh3が上下にきちんと配置されるようにデザインされており、逆に置かれるというのは最初から考慮されていません。(これは至極真っ当な作り方です。私が変なことをしてるだけですよ。)

つまり日付を上部に置いてh3を割り当てつつ、エントリタイトル下部にしてh2を割り当てることはできなかったのです。単純に入れ替えたところ、レイアウトがグチャグチャになって見られたものじゃありませんでした。これじゃ検索エンジン以前の問題です。

HTMLだけを改造してエントリタイトルにそのままh2を割り当てるのは不可能そうだったので、しかたなく苦手なCSSとにらめっこ。テキストのスタイルを入れ替えつつ、レイアウトは変えないように試行錯誤して何とか入れ替えに成功しました。(つまりあなたが今見ているのは、すでに改造済みのテンプレートなわけです。)

現在はエントリタイトルがh2に、日付がh3に割り当てられています。本当はエントリ内の段落も<strong>からh3辺りに変更したいのですが、これはもうちょっとCSSをいじらないと無理そうですね。(そのままh3を使うと何とも変な隙間が……。)

ついでに使わないエントリごとのエディットリンクを消して、できた隙間にソーシャルブックマークのボタンを配置しました。これは結構いい感じのなったような気がします。

ここでGoogle先生のお告げが！！

これで問題なくなったのだろうか……と思いつつ、前編を投稿した後にいつも使っているGoogleウェブマスターツールでサイトマップの更新をおこないました。普段どおりにウェブクロールなどの情報を見ていると、なにやら見慣れないものが。

Googleウェブマスターツールの警告

なんとGoogleウェブマスターツールでmetaタグについて警告を受けてました。
重複するメタデータ(descriptions)の記述されたページって、要するに同じdescription(概要)を別ページでも使ってるから駄目だよってことですよね？今までこれを見たことがなかったのは、旧テンプレートには元々descriptionが設定されていなかったからでしょう。

他の検索エンジンはわかりませんが、少なくともGoogleは「違うページで同じdescriptionを使うことを推奨してない」という風に考えて良さそうです。いやはや、こいつは勉強になりました。

結論

  • むやみにmetaタグでdescriptionを設定すると検索結果が変になることがある
  • 見出しタグ(h2やh3)は有効に使った方が良さそう
  • Googleは複数のページで重複するdescriptionを推奨しない
我ながら勉強になったような気がします。
といったところで、今回はこの辺で。