ブログの目次を最適化する方法

ブログの目次とSEO SEO

目次は悩ましい問題です。
目次が少しでも長いと、たくさんのユーザーが離脱します。

以下の図は、ある記事の目次離脱率を計測した表です。
サイト内で最もPV(検索流入数)が多い記事です。

目次の離脱率
この画像をツイートする

赤色で囲ってある箇所に注目してみてください。
1ヶ月の計測期間のうち、目次を見ただけで、3割のユーザーが離脱しています。

この記事は、非常に幅広いトピックスを扱っています。
いわゆる包括的なコンテンツです。

そのため、目次の数が29個もあります。
ユーザーは、目次を見ただけで「うんざり」して、離脱しているのです。
しかし記事が成功しているため、目次はそのままにしています。

目次離脱率の計測方法
この画像をツイートする

もちろん目次を削除すれば、(目次の)離脱は0になります。
だからといって、簡単に削除すべきではありません。

目次のベストアンサーは、何でしょうか?
このガイドでは、WordPressのブロガーにとって、優れた目次戦術を提供します。

目次を削除すると順位はアップするか?

冒頭のデータが示すように、目次があるだけで、高い離脱率となる場合があります。
それでは、目次を削除して離脱率を減らせば、検索順位が上がるのでしょうか?

実際に試したデータがあります。

目次削除後のPV
この画像をツイートする

このデータは、ある記事の目次離脱率を計測したグラフです。
2月15日に目次を削除しているので、初期の離脱が大きく改善されたことが分かります。
20%〜30%の離脱率だったのが、ほぼ0になっています。

目次は離脱の大きな要因です。

しかし、同じ記事のPVがどう変わったかを見てみましょう。
こちらが検索流入の推移グラフです。

目次削除後のPVと順位の変動

見ての通り、2月15日以降にPVの変化は起こっていません。
また検索順位は、10位前後から圏外に飛んでしまいました。

これは、目次を削除したから、順位が下がったのではありません。
このように、ある事象の原因がひとつだと思い込むのは、危険な間違いです。
人は複雑な事象に対して、複数の要因を処理するのが苦手だからです。

グラフを見ての通り、順位は圏外になっても、検索流入は減っていません。
これは「ビッグワードが飛ばされて、複合のキーワードからの流入が増えた」ということです。
つまり、Googleがユーザーに最適な検索結果を返すように変化しただけです。

結局は「目次を付けるべき・消すべき」という単純な話ではありません。
それでは、どのように目次を最適化すれば良いでしょうか?
目次を最適化する方法があります。

ブログの目次を最適化する方法

目次は、適材適所が基本です。

前述のように、30%の離脱率を恐れる必要はありません。
記事ごとに最適化することで、最大のパフォーマンスを発揮することができます。

ここでは、記事のパターンに分けて、具体的な方法を説明します。

目次が不要な記事と必要な記事

検索から来るユーザーに対し、簡潔に解決できるコンテンツには、目次が不要です。

例えば「FireFoxアプリをインストールする方法」というコンテンツに目次は不要です。

最初から読まなければ、意味が通じないからです。
また、検索する意図が限定されています。

目次プラグインを使っている場合、短い記事であれば、表示をオフにすると良いでしょう。

目次が必要な記事

一方で、包括的なコンテンツには、目次が必要です。
例えば「FireFoxアプリの使い方(インストールから詳しい機能まで)」というコンテンツです。

検索から来たユーザーは、目次を見て必要な情報を探します。
「ブックマークの使い方」を探しているユーザーは、「インストール方法」から見せられると離脱するでしょう。
たくさんのユーザーに情報を提供するには、目次が必要です。

目次を計測して順番を入れ替える

Google タグ マネージャーを使えば、目次内のクリック率が測定できます。
計測したクリック数は、Googleアナリティクスでチェックします。

下図の赤枠に注目してみてください。

目次のクリック率を測定

4.2という数字は、「4番目のh2見出し内」の「2番目のh3見出し」です。
記事の下にあるのに、クリック数が多いことに注目です。(10%の人がクリック)
これは、需要が高い項目です。
なるべく記事の上に移動させましょう。
ユーザーは、早く情報を知りたいからです。

目次クリック率の高い見出しは上に移動させる
この画像をツイートする

次は、【3.2.2】と【2.1.2】に注目してください。
3.2.2という数字は、「3番目のh2見出し内」の「2番目のh3見出し内」の「2番目のh4見出し」です。
つまりh4見出しという小さな扱いです。
それにも関わらず、これほどクリックされているのですから、需要が高いと言えます。
h4見出しからh3見出しに昇格させることで、ユーザーの体験を向上させることができます。

目次クリック率のH4見出しをH3にする
この画像をツイートする

単純に見出しタグを変えるだけでなく、全体をリライトして調整します。
このように、クリック率が高い目次は、優先度を高くしましょう。

目次から検索需要を読み取る

目次のクリック数が多い項目は、そのまま検索需要が高いと言えます。
したがって、その箇所をリライトして強化すると、記事の評価も上がる可能性があります。

ただし、注意が必要です。
どの検索キーワードで来た人が、どの目次をクリックしたかは、どうやっても調べることができません。
「FireFoxのアドオン」で検索した人は、「アドオン」という目次をクリックするでしょう。
必ずSearch Consoleで、検索キーワードの順位をチェックしてください。

もうひとつ、例があります。
「地球温暖化について」という記事で、「原因」という目次のクリック数が多い場合です。
これは「地球温暖化の「解決方法」よりも、『原因』について知りたい人が多い」ということです。

通常のコンテンツであれば、解決を先に書いて良いのですが、需要が逆転している場合は、原因から書きます。
このように、目次のクリック数は、多くのことを教えてくれます。

目次のクリック率を測定する方法

Googleタグマネージャーを使えば、目次のクリック率を測定できます。
私は以下の設定にして計測しています。

GTMで目次を計測する設定

「ラベル」を「Click Text」にすることで、目次のテキストをGoogleアナリティクスで見ることができます。
しかしGoogleタグマネージャーは、少し敷居が高いかもしれません。

初心者の方は、ヒートマップのプラグインを使って、目次のクリック数をチェックする方法があります。

ヒートマップ解析ツール User Heat
ヒートマップ解析ツール開発企業のユーザーローカルが提供する、無料ツール。アイトラッキングを疑似体験。

WordPressの目次プラグイン

WordPressでは、目次を自動生成するプラグインがあります。
目次プラグインは「Easy Table of Contents」がオススメです。

Easy Table of Contents
使いやすい目次を、ページの内容に基づき完全自動で生成し表示します。

その他にもTable of Contents Plusというプラグインもありますが、こちらは更新が止まってしまいました。
また、あらかじめ目次機能が付いたWordPressテーマもあります。

H3見出しまで目次にする

WordPressの目次プラグインは、「どの見出しを目次に出力するか?」を設定できます。
これは「H3見出し」までにすると便利です。

目次プラグインの設定

もし目次に出したい「H4見出し」があったとき、「H3見出し」に変えれば良いのです。
逆に「目次に出したくないH3見出し」は、「H4見出し」にします。

「H4見出し」と「H3見出し」を入れ替えることで、構造が変わるのを気にする人は多いと思います。
SEOに悪い影響があるかどうかです。
これぐらいでは、順位に悪い影響は考えられません。

検索結果に見出しのショートカットを出す

目次は、SEOにおいてもメリットがあります。
見出しへのショートカットが、検索結果に出るときがあります。
これは「スニペット」と呼ばれているものです。(もしくはリッチリザルト)

以下のようなGoogle検索結果の表示です。

検索結果のスニペット

これは、非常に便利な検索機能です。
特に包括的な記事では、検索ユーザーが知りたい内容を素早く見つけることができます。

見出しのスニペットを出す方法

見出しのスニペットを出すには、見出しタグにidを付けるのが条件です。
idがなければ、リンクから見出しに飛べません。

一番簡単な方法は、目次を付けることです。
目次を付ければ、設定した見出しにidが自動で付きます。

idがない見出しはスニペットに出ない

例えば目次プラグインで「H3見出し」まで出している場合、「H4見出し」は、スニペットに出ません。
そのため、先ほどの「H4見出し」を「H3見出し」にするという小技が使えます。
ただし、不自然にならないように文章構造に注意してください。

もちろん「H4見出し」にidを付けても良いでしょう。

スニペットは制御できない

スニペットは、私たちにコントロールすることができません。
検索されたキーワードごとに、検索結果は変化します。
条件を満たしていても、確実にスニペットを出す方法はありません。

検索結果の説明文

検索結果に見出しのショートカットが出る場合、説明文はどうなるのでしょうか?
これは、見出し直下の文章が選ばれます。※meta descriptionは無視される。

検索結果の説明文
この画像をツイートする

そのため、各見出しの下にはその見出しの内容を説明する文章を書くと良いでしょう。

目次を非表示にしてもスニペットは出る

目次プラグインでは、目次の初期表示を「非表示」にすることができます。
その場合も、見出しのスニペットは出てくるようです。

ただしこれは、私が試しただけの情報です。
あくまでスニペットは、サイト側でコントロールできないのが前提です。

裏技:目次を2つ出す

目次を「H3見出し」までに設定してると、「H4見出し」〜「H6見出し」は、スニペットに出てきません。
スニペットを出したいからと言って、「H6見出し」まで出すと、大幅に離脱を増やします。
冒頭のように、長すぎる目次は大量離脱につながります。

そこで裏技的ですが、目次を2つ出す方法があります。
当サイトでは、一番下にも目次を出しています。
2種類のプラグイン「Table of Contents Plus」と「Easy Table of Contents」を使っています。

目次を2つ出す場合、必ずアンカー接頭辞を設定してください。

目次プラグインの接頭辞

そうしないと、片方の目次が機能しません。

サイドバーの目次がオススメできない理由

WordPressの目次プラグインは、サイドバーに付けることもできます。
ただし、これはオススメできません。

モバイルサイトだと、サイドバーは記事下になるからです。
スニペットのためにサイドバーは「あり」ですが、モバイルユーザーにとって非常に不便です。

目次はユーザーの役に立つ

最後に「目次はユーザーの役に立つ」ということをお伝えします。
例えば、当記事です。

この記事では、WordPressに最適な目次戦略を説明しています。
トピックスが長く、包括的な記事です。

そのような記事では、知りたい情報に素早くアクセスできる目次は、やはり便利です。

また、検索ユーザーとの相性も良くなります。
例えば「WordPressで目次を2つ出す方法」を探しているユーザーがいるとします。
そのような数の少ないニッチユーザーも、取りこぼしがなく、解決できるからです。
もし、目次がなければ、2〜3回スクロールしただけで、離脱するでしょう。

逆に短いトピックスで、必要な情報を素早く提供できれば、目次がない方が良いです。

WordPressの目次プラグインは、記事ごとに目次を非表示にできるので、ぜひ使い分けてみてください。