ブログの見出しの付け方|H2・H3の使い分けと伝わる4つのコツ

本記事にはアフィリエイト広告(PR)が含まれています。
ブログの見出しの付け方 見出しで結論を伝えろ。(アイキャッチ)

見出しを見て、記事の結論がわかるように作れ。

H2とH3、どっちを使えばいいのか。見出しを入れようとして手が止まったこと、ありませんか?

私も、PREP法で見出しを作ろうとして、うまくまとまらなかったことがあります。なんとなく見出しを置いて書き進めると、途中で話の筋が通らなくなり、自分でも読みにくい記事になっていました。見出しで結論が決まっていないと、その下の本文もぶれるんです。

見出しは、目次に並べたときに記事の中身がわかるように付けるのがコツです。この記事では、H2・H3の使い分けと、見出しだけで中身が伝わる付け方を、ビフォー・アフターとチェックリストつきで紹介します。

この記事でわかること

  • 見出しが読者とGoogleの両方に役立つ理由
  • H1・H2・H3の役割と、使い分けのルール
  • H2・H3で迷いやすい4つの疑問への答え
  • 伝わる見出しを作る4つのコツと、直す前・直した後の例

先に、40秒の動画で全体の流れをまとめました。音が出るので、音量に気をつけて再生してください。

目次

見出しは「目次に並べただけで中身がわかる」ように付ける

中身が見えない見出しの目次と、目次だけで結論と流れがわかる目次の比較図

いい見出しは、目次に並べて上から読むだけで、記事の結論と流れがわかります。本文を読まなくても「この記事で何がわかるか」が伝わる状態です。

読者は記事を最初から順番に読んでくれるとは限りません。スマホで開いたら、まず目次をざっと見て、自分の知りたいところまで一気にスクロールする。私も調べものをするときは、ほとんどこの読み方です。

見出しが役に立つ場面は、大きく3つあります。

  • 目次:開いてすぐ、読むかどうかを決める材料になる
  • 流し読み:スクロール中に、知りたいところで手を止める目印になる
  • 検索エンジン:Googleが、記事にどんな話がどの順で書いてあるかを読み取る手がかりになる

逆に、見出しが「はじめに」「メリット」「注意点」だけだと、どの記事にも当てはまってしまい、中身が見えません。読者は目次を見ても判断できず、そのまま戻ってしまいます。

例:目次で比べてみる

中身が見えない目次:はじめに/原因/対策/まとめ

中身が見える目次:打鍵音の原因は「底打ち」と「机の響き」/デスクマット1枚で響きはかなり減る/静音リングで底打ちの音を消す/まとめ:今のキーボードのままでも静かにできる

下のほうは、目次だけで「原因が2つあって、対策はマットとリング」とわかります。見出しを付けるときは、この状態をめざします。

H2は章、H3は節。H1は記事タイトルなので本文では使わない

H1は記事タイトル、H2は章、H3は節という見出しの階層を、スマホの設定アプリにたとえた図

見出しのH1・H2・H3は、文字の大きさではなく、話の階層をあらわしています。H1が記事のタイトル、H2が大きな話のかたまり(章)、H3はH2の中を細かく分けたもの(節)です。

スマホの設定アプリと同じです。「設定」を開くと「通知」「画面表示」などの項目が並び、「通知」を開くと、さらに「LINE」「メール」とアプリごとに分かれていますよね。

見出し役割設定アプリでいうと
H1記事のタイトル(1記事に1つ)「設定」の画面そのもの
H2大きな話のかたまり(章)「通知」「画面表示」などの項目
H3H2の中をさらに分けたもの(節)「通知」の中の「LINE」「メール」

WordPressでは、記事のタイトル欄に入れた文字が自動でH1になります。SWELLなどのテーマでも同じ。なので本文の中では、見出しはH2から使い始めます。本文にもH1を入れると、タイトルが2つある記事に見えてしまうので避けましょう。

見出しの入れ方はかんたんです。WordPressのブロックエディターなら、行の頭で「## 」(#を2つと半角スペース)と打つとH2、「### 」と打つとH3になります。あとから変えたいときは、見出しを選んで、上に出るツールバーの「H2」「H3」をポチッと切り替えるだけです。

もう1つのルールは、階層を飛ばさないこと。H2の下にいきなりH4を置かず、H2 → H3 → H4の順に1段ずつ。設定アプリで、「通知」を開かずに「LINE」の画面には行けないのと同じです。

H2・H3で迷いやすい4つの疑問

H2を続けていいか、H3が1つだけでいいか、文字の大きさで選んでいいか、H4は使うか、の4つの疑問と答えの図

ルールはわかっても、実際に書くと迷う場面が出てきます。よく聞かれる4つの疑問に答えます。

H3を挟まずにH2を続けていい?

問題ありません。H3は、H2の中をさらに分けたいときだけ使うものです。中身が短くて分ける必要がなければ、H2の下は本文だけでOK。H2が続く記事は、むしろすっきりして読みやすいですよ。

H3が1つしかないのはおかしい?

H2の下にH3が1つだけなら、分けている意味がほとんどありません。H3の中身をH2の本文に入れてしまうか、本当に分けたいなら、もう1つ話を足して2つ以上にします。H3は「2つ以上に分けるとき」に使う、と覚えておくと迷いません。

文字の大きさで見出しを選んでいい?

おすすめしません。「H2だと大きすぎるからH3にしよう」と選ぶと、話の階層と見出しがずれて、目次がおかしくなります。見出しの見た目を変えたいときは、テーマの設定(SWELLなら「外観」→「カスタマイズ」の中にある見出しのデザイン設定)で変えます。文字を目立たせたいだけなら、見出しではなく太字やボックスを使いましょう。

H4は使ったほうがいい?

ブログ記事なら、H3までで足りることがほとんどです。H4が必要になるくらい細かく分かれるときは、H2が大きすぎるのかもしれません。H2を2つに分けられないか、先に考えてみてください。

伝わる見出しを作る4つのコツ

見出しに結論を入れる、キーワードは自然に、スマホで2行まで、同じ階層の形をそろえる、の4つのコツの図

見出しを付けるときは、次の4つを意識すると、見出しだけで中身が伝わるようになります。

  1. 見出しに結論を入れる
  2. キーワードは自然に入れる
  3. スマホで2行におさまる長さにする
  4. 同じ階層の見出しは形をそろえる

コツ1:見出しに結論を入れる

「原因」「メリット」のような言葉だけで終わらせず、その章で言いたい結論を見出しにします。「打鍵音の原因」ではなく「打鍵音の原因は「底打ち」と「机の響き」」。これだけで、読者は本文を読む前に答えがわかります。

これは、PREP法の最初の「P(結論)」を見出しに出しておく、ということでもあります。見出しで結論が決まっていれば、本文は「理由 → 具体例 → もう一度結論」の順に書くだけ。私がPREP法でまとまらなかったときは、たいてい見出しが「原因」のような言葉だけで、結論が決まっていませんでした。

結論の形にする考え方は、構成の作り方の記事のステップ5でも紹介しています。

コツ2:キーワードは自然に入れる

メインのキーワードは、H2のいくつかに入っていれば十分です。全部の見出しに無理やり入れると、同じ言葉が何度も並んで、かえって読みにくくなります。目次を声に出して読んでみて、引っかからなければOK。

コツ3:スマホで2行におさまる長さにする

見出しが長すぎると、スマホでは3行、4行と折り返して、ぱっと読めなくなります。目安は25文字前後まで。言いたいことが多いときは、見出しには結論だけを残して、理由は本文に回します。

コツ4:同じ階層の見出しは形をそろえる

手順を並べるなら「ステップ1:〇〇する」「ステップ2:〇〇する」のように、同じ階層の見出しは書き方をそろえます。1つだけ「〇〇について」になっていたりすると、目次で見たときにちぐはぐに見えます。この記事のH3も、「コツ1」「コツ2」…と同じ形にしています。

ビフォー・アフターで見る見出しの直し方

打鍵音についてなどの中身が見えない見出しを、結論が見える見出しに直したビフォー・アフターの図

よくある見出しを、4つのコツで直すと次のようになります。例はタイトルの付け方の記事と同じ「キーボード 打鍵音 うるさい」です。

直す前直した後直したところ
打鍵音について打鍵音の原因は「底打ち」と「机の響き」結論を入れた
対策デスクマット1枚で響きはかなり減る何をするとどうなるかを入れた
キーボードの打鍵音がうるさいときにおすすめの静音リングの付け方と注意点静音リングで底打ちの音を消す長すぎるので結論だけ残した
キーボード打鍵音うるさい対策まとめまとめ:今のキーボードのままでも静かにできるキーワードの詰め込みをやめた

直す前の見出しは、どれも「何の話か」しかわかりません。直したあとは「だからどうなるか」まで入っています。

H3も同じように直せます。たとえば「静音リングで底打ちの音を消す」の下なら、こんな並びです。

例:H2とH3の並び

H2:静音リングで底打ちの音を消す

 H3:静音リングはキーキャップの裏にはめるだけ

 H3:厚さは2mmくらいから試すと打ち心地が変わりにくい

H3が2つあって、どちらもH2の話を細かく分けたものになっています。これがH2とH3のちょうどいい関係です。

書き終えたら目次で見直すチェックリスト

書き終えたあとに目次で見直す見出しチェックリスト8項目の図

見出しは、書き終えたあとに目次で見直すのがいちばん確実です。SWELLなどのテーマは、H2・H3から目次を自動で作ってくれるので、プレビュー画面で目次だけを上から読んでみてください。

  • 本文にH1を入れていないか(見出しはH2から)
  • H2 → H4のように、階層を飛ばしていないか
  • 文字の大きさで見出しを選んでいないか
  • H3が1つだけのH2がないか
  • 目次だけで、記事の結論と流れがわかるか
  • 「はじめに」「メリット」のような、中身の見えない見出しがないか
  • スマホで見たとき、2行におさまっているか
  • 同じ階層の見出しの書き方がそろっているか

全部に✓がついたら、見出しは完成です。引っかかった見出しだけ直せばいいので、5分もかかりません。

まとめ:見出しだけで中身が伝わるか、目次で確かめる

見出しのH2・H3の使い分けと伝わる4つのコツ、やってはいけない3つを1枚にまとめた図
  • 見出しは、目次に並べただけで記事の結論と流れがわかるように付ける
  • H1は記事タイトル、H2は章、H3は節。本文の見出しはH2から使う
  • 階層は飛ばさない。H3は2つ以上に分けるときに使う
  • 見た目を変えたいときは、見出しの種類ではなくテーマの設定で変える
  • 結論を入れる・キーワードは自然に・2行まで・形をそろえる、の4つを意識する

見出しが決まったら、次は記事の最初の数行、導入文です。読者に「この記事を読もう」と思ってもらえる導入文の書き方は、次の記事で解説します。ブログの導入文(リード文)の書き方|読まれる4つのパーツと例文テンプレート

よかったらシェアしてね!
  • URLをコピーしました!

コメント

コメントする

目次