前回は、記事の保存が「403 Forbidden」で止まった原因をConoHa WINGのWAFで調べたり、開業届の住所のことでバーチャルオフィスを調べたりしていました。トラブル対応と独立の準備が続いていたので、今回はブログの「読みやすさ」に戻ってみます。
最近の記事は1本2,000字前後になることが多くて、スマホで読み返すと「今どこの話をしているんだっけ？？」と自分でも迷いそうになりました。そこで気になったのが、記事の最初に出る「目次」です。
今回は、このブログで使っているテーマCocoonの目次機能と、目次の元になる見出しの使い方を、AI（Claude）にCocoon・WordPress・Googleの公式情報から集めてもらい、私が読んで方針を考えました。実際の設定画面はまだ開いていないので、「調べてみた」段階の記録です。
記事が2,000字を超えてきて、読む人が迷子にならない？？
このブログの記事は、だいたい「前回までの流れ → 調べたこと → わかったことと次にやること」という並びで書いています。見出しは4〜6個くらい。書いている私は流れがわかっていても、検索から来た人は「知りたいところだけ読みたい」はずです。
GoogleのSEOスターターガイドにも、「読みやすいコンテンツ」の項で、長い文章は段落や章に分けて、全体を見通せるように見出しを付けるように、と書かれていました。目次は、その見出しを一覧にして最初に見せてくれる機能なので、相性がよさそうです。
Cocoonの目次ってどこで設定するの？？設定項目を調べてみた
Cocoonの公式サイトによると、目次はWordPress管理画面の「Cocoon設定」→「目次」タブで設定します。目次用のプラグインを入れなくても、テーマの機能だけで目次を出せるそうです。公式ページに載っていた設定項目は、こちらです。
| 設定項目 | 公式の説明（要約） |
|---|---|
| 目次の表示 | 目次を表示するか・しないかの切り替え |
| 表示ページ | 目次を表示するページを指定する |
| 目次のタイトル | 目次の見出し |
| 目次切り替え | 目次を開いたり閉じたりする機能の設定 |
| 目次表示の深さ | 目次に出す見出し（hタグ）のレベル |
| 目次ナンバーの表示 | 目次に番号を付けるか |
| 目次の中央表示 | 目次を中央に寄せて表示するか |
| 目次の表示順 | 目次と広告の並びを入れ替える |
| 見出し内タグ | 目次に使う見出しの中のHTMLタグを取り除くか |
「見出し内タグ」は、クラシックエディターで公開ページの見出しをコピーして貼ると、目次を動かすためのタグが混ざって目次がうまく動かなくなるのを防ぐ機能だそうです。ブロックエディターではタグは混ざらないと書かれていたので、このブログではあまり気にしなくてよさそうです。
公式ページは項目の一覧と説明だけで、それぞれの初期値（最初から何が選ばれているか）までは書かれていなかったよ。今の設定は、管理画面を開いて確かめるしかなさそう！
目次は見出しから自動で作られる！H2・H3の使い分けがそのまま目次になる
Cocoonの公式ページには、目次はH見出しを元に作られ、本文の中でH2〜H6の見出しが使われていないと目次は表示されない、と書かれていました。つまり、目次をきれいに出すには、見出しをきちんと使うことが先です。
WordPressの公式ドキュメント（見出しブロック）では、見出しはH1〜H6のレベルを選べると説明されています。そして、多くの場合はページのタイトルがH1として使われ、本文の見出しブロックはH2、H3…と使う、とありました（テーマやページによって違うこともある、という注意つき）。
見出しブロックは、キーボードでも入れられるそうです。
- 行の頭で「##」と半角スペースを入力すると、H2の見出しになる
- 「###」と半角スペースならH3の見出しになる
- 「#」を増やすと、H6まで同じように入れられる
ここで気になったのが、Googleは見出しの順番を気にするのか？？ということ。SEOスターターガイドでは、見出しを意味の順番どおりに並べるのはスクリーンリーダー（画面を読み上げる機能）を使う人にはよいけれど、Google検索にとっては順番どおりでなくても問題ない、と書かれていました。さらに、ページごとに「魔法の見出し数」や理想的な見出し数というものはない、とも。
「見出しの順番を守らないと検索で不利になる」と思い込んでいたけど、Googleの説明はそうじゃなかった！順番を整えるのは、検索のためというより、読む人と目次のためなんだね。
目次を出す条件（見出しの数）と表示する位置はどう決める？？
計画の段階では、「見出しが何個以上あったら目次を出す」という条件や、「最初の見出しの手前に出す」といった位置の設定があると思っていました。ところが、Cocoonの公式の目次ページでは、どちらも確認できませんでした。
- 見出しの数の条件と、その初期値：公式の目次ページには数の記載がなかった（わかったのは「H2〜H6が使われていないと表示されない」ことだけ）
- 表示する位置：公式の項目一覧にあったのは「目次の表示順＝目次と広告の並びの入れ替え」で、位置を細かく決める項目は確認できなかった
なので、ここは「まだわからない」です。実際の設定画面を開いて、どんな項目が並んでいるか確かめてから決めます。
その代わり、今の時点で決められる方針は考えてみました。
- 本文の大きな区切りはH2、その中を分けたいときだけH3を使う（H2を飛ばしていきなりH3にしない）
- 目次に出すのはH2とH3くらいまでにして、目次が長くなりすぎないようにする（「目次表示の深さ」で調整できるか、画面で確かめる）
- 見出しは、目次だけ読んでも中身がわかる言葉にする
記事ごとに目次を消すこともできる？？
短いお知らせのような記事では、目次はいらないかもしれません。記事ごとに目次を出さない設定があるのか調べてもらいましたが、Cocoonの公式の目次ページでは、その項目の名前は確認できませんでした。公式フォーラムに「投稿画面のサイドでも設定できる」という利用者の書き込みがあっただけです。
目次のウィジェットやショートコードも、公式の目次ページでは説明を確認できなかったので、決めつけないでおきます。
ネットでは「この項目にチェックを入れるだけ」みたいな説明をよく見かけるけど、公式で項目名を確かめられなかったから書けなかった…。フォーラムの書き込みは利用者の声で、公式の説明とは別物だから気をつけてね！
今回わかったことと、次にやること
- Cocoonの目次は「Cocoon設定」→「目次」タブで設定する。プラグインなしで使える
- 目次は見出し（H2〜H6）から作られ、見出しがないと表示されない
- WordPressでは多くの場合タイトルがH1で、本文の見出しはH2から使う
- Googleは、見出しが順番どおりでなくても検索には問題なく、理想的な見出し数もないと書いている。順番を整えるのは読む人のため
- 見出しの数の条件・初期値、表示位置の設定、記事ごとに消す項目の名前は、公式で確かめられなかった
次にやることは、こちらです。
- 管理画面の「Cocoon設定」→「目次」タブを実際に開いて、今の設定と項目を記録する
- 「目次表示の深さ」をH3までにできるか確かめて、方針どおりに設定する
- 投稿の編集画面に、記事ごとに目次を消す項目があるか確かめる
目次は「付ければ終わり」ではなく、見出しの付け方しだいで読みやすさが変わるものだとわかりました。設定画面を確かめたら、前と後の表示を比べて記録します。
コメント