「トップに戻る」より「目次に戻る」ボタンが良い理由と設置方法

2022年3月更新
ブログのテーマをCocoonから SWELL へ移行しました。記事の内容は有効ですが、紹介しているプラグインは現在実装はしていません。ご了承ください。

ブログを書く際には、筆者目線と読者目線の2つを持つように意識しています。

そんな私がいつも感じていた「トップじゃなくて目次に戻って、もう一度あの見出しを読みたい」を実践してみました。

この記事では「目次に戻る」ボタンをおすすめする理由と設置方法をご紹介します。

目次に戻るボタンの必要性

いまはSEO対策を意識したブログや記事が多くなり、2,000〜3,000文字というボリュームが一般的になりました。

2,000文字を読むのにかかる時間は約3分と言われています。

文字数が多く縦に長い記事は読者がページ内で迷子になりやすく、迷子になるとページから離脱する可能性が高くなります。

利便性を上げるために「トップに戻る」ボタンが使われていますが、画像や導入文が長い記事ではトップに戻っても読者の知りたい情報は得られません。

読者が「もう一度読みたい」と思った見出しへスムーズに誘導して、迷子になるのを防ぐためには、「トップに戻る」ボタンよりも「目次に戻る」ボタンをおすすめします。

目次に戻るボタンに期待する効果

当ブログのPV数はまだ多くないため、「トップに戻る」と「目次に戻る」のどちらが読者にメリットが大きいか、検証することはできていません。

ただ「目次に戻る」ボタンにして、もう一度読みたい見出しへラクに遷移できると、こういう効果があるんじゃない！？という仮説は立てています。

目次に戻るボタンは画面の右下に

一般的にサイトへのデバイス別アクセス数は、スマホが7割と言われています。

以下の調査によると、右利きの人も左利きの人もスマホの操作は右手で行う人が大半のようです。

目次へ戻るには、右手の指でいちばん操作しやすい位置＝画面の右下にボタンがある方が、ユーザビリティが高いと思われます。

目次に戻るボタンを設置する方法

ここからはWordPress向けの説明となります。

「目次に戻る」ボタンを設置するにはRich Table of Contents（RTOC）というプラグインを使うのがいちばん早くて簡単です。

RTOCは、WordPressのテーマ「JIN」の制作者であるひつじさんが作成された目次プラグインです。

RTOCで目次を設定すると、自動的に画面右下に「目次に戻る」ボタンが設置されます。手間いらずでとっても便利！

使い方は初見でも理解できるほどシンプルです。動画付きでツイートされていますので、ぜひご確認ください。

【超お知らせ】

目次プラグイン「Rich Table of Contents」をリリースしました！

・無料プラグイン
・誰でもリッチな目次が作れる
・最新WPとの互換性100%
・目次へ戻るボタン標準搭載

プラグイン検索で「RTOC」と打てば一発で出てくるのでぜひ使ってみてください🙌https://t.co/bXNU2Tjxdl pic.twitter.com/we7hqhsM06

— ひつじ@JIN: R制作 (@hituji_1234) March 1, 2020

また冒頭で説明した通り、読者は右手でスマホの操作をしていることが多いので「目次に戻るボタンの位置」は右寄せがおすすめです。

RTOCを使うなら、テーマの目次機能はOFFに！

私の場合は、CocoonというWordPressのテーマを使っています。

RTOCを有効にすると、「Cocoon標準機能の目次」と「RTOCで作られた目次」が2つ縦に並んでしまいます。

これでは見栄えもユーザビリティも悪いので、Cocoonの目次をOFFにしましょう。

WordPressをお使いの方で、Cocoon以外のテーマを利用されている方も多いと思います。

テーマに目次が標準装備されてる場合は、OFFにすることを忘れないように！

まとめ：「目次へ戻る」ボタンで迷子をなくそう！

文字数が多く縦長の記事は、読者が迷子になりがちです。

「トップに戻る」ボタンよりも、「目次に戻る」ボタンでもう一度読みたい見出しにスムーズに誘導することで、ユーザビリティを高めることができます。

Rich Table of Contents（RTOC）というプラグインを使えば、「目次に戻る」ボタンの設置は数分で完了。

読者が迷わず、しっかりじっくり記事を読める環境を整えましょう！