WordPressでブログを書いていると、
「H1」
「H2」
「H3」
という言葉が出てきます。
最初は、
「数字が違うだけ？」
「文字の大きさを変えるためのもの？」
「H2よりH3のデザインが好きだから、H3を使ってもいい？」
と思うかもしれません。
実は見出しは、文字を大きくしたり装飾したりするためだけのものではありません。
記事の中身を、章や項目に分けて構造を伝えるためのものです。
今回は、記事タイトルとH1の関係から、本文にH1を使っていいのか、H2・H3・H4はどんな順番で使えばいいのかまで、WordPress初心者向けに整理します。
そもそもH1・H2・H3って何？
H1やH2の「H」は、Heading、つまり見出しという意味です。
数字によって、見出しの階層が変わります。
記事全体のタイトルがH1。
その中の大きな話題がH2。
H2の中をさらに分けるときにH3。
さらに細かく分けるときにH4。
というように使います。
たとえば、
H1：WordPressブログの始め方
という記事があったとします。
その中に、
H2：WordPressを準備する
があり、その中を、
H3：レンタルサーバーを契約する
H3：独自ドメインを取得する
と分ける。
さらに必要なら、
H4：料金プランを選ぶ
のように細かくしていきます。
こうすると、人が読んでも記事の構造が分かりやすくなります。
WordPressの記事タイトルはH1になっていることが多い
WordPressで記事を書くとき、最初に投稿タイトルを入力します。
一般的なWordPressテーマでは、その投稿タイトルが記事ページ上でH1として出力されることが多いです。
つまり、
WordPressの編集画面で、
記事タイトル：記事タイトルとH1は同じでいい？
と入力すると、公開ページではテーマ側が、
H1：記事タイトルとH1は同じでいい？
として表示してくれる仕組みです。
そのため、普通にWordPressで記事を書いているなら、自分で本文の最初に同じタイトルをH1として追加する必要は基本的にありません。
記事タイトルとH1は同じでいい？
基本的には、同じで大丈夫です。
むしろWordPressでは、記事タイトルをそのままH1として表示する作りが分かりやすいです。
ここで少しややこしいのが、
記事タイトル
SEOタイトル
H1
という3つの言葉です。
似ていますが、役割が少し違います。
記事タイトルは、WordPressの投稿につけるタイトル。
H1は、ページ内で記事全体の主題を示す一番大きな見出し。
SEOタイトルは、検索エンジンへページタイトルを伝えるtitle要素として設定するものです。
WordPressでは、
記事タイトル＝H1
になっていて、さらにSEOタイトルも同じ文章を使うことがあります。
全部同じでも問題ありません。
必要なときだけ、SEOタイトルを検索結果向けに少し調整するくらいで大丈夫です。
本文の中にH1を使っても大丈夫？
ここは初心者だと迷いやすいところです。
WordPressの記事タイトルがすでにH1として表示されているなら、本文の中でもう一度H1を使う必要は基本的にありません。
本文は、
H2から始める
と考えると分かりやすいです。
つまり、
記事タイトル
↓
H2
↓
H3
↓
H4
という流れです。
「本文にH1を入れたら絶対にSEOでペナルティになる」
というほど単純な話ではありません。
ただ、ページ内に同じくらい重要そうな大きな見出しがいくつもあると、
どれがこの記事の本当のタイトルなのか
構造が分かりにくくなります。
だからWordPressブログなら、
H1は記事タイトルに任せて、本文はH2から。
これで十分です。
H1が2つあったらダメ？
これもよく気になるところです。
昔は、
「H1は1ページに絶対1つ」
と強く言われることがありました。
現在のHTMLでは、複数のH1が存在しただけで即問題になるという単純なルールではありません。
ただし、ブログ記事の場合は話を難しくする必要はありません。
記事の主題は基本的にひとつなので、
記事タイトルをH1にして、それ以外はH2以下にする。
これが一番分かりやすいです。
「複数でも絶対ダメではない」からといって、わざわざ本文へH1を増やす理由もありません。
初心者のうちは、
H1は記事タイトルだけ。
くらいに覚えておけば迷いにくいです。
H2・H3・H4には順番がある
ここもかなり大事です。
H2、H3、H4は、単に文字サイズが違う見出しではありません。
記事の階層を表しています。
基本的には、
H2
↓
H3
↓
H4
というように、大きな話から細かい話へ降りていきます。
たとえば、
H2：SEOタイトルとは？
という大きな話があって、その中に、
H3：記事タイトルとの違い
がある。
さらにその中で細かく説明するなら、
H4：検索結果ではどう表示される？
とします。
この流れなら構造が分かりやすいです。
H3のあとにH2へ戻るのは大丈夫？
これは大丈夫です。
たとえば、
H2：SEOタイトルとは
H3：記事タイトルとの違い
H3：H1との違い
H2：SEOタイトルの書き方
という流れ。
最初のH2の話が終わって、新しい大きな話題へ移ったのでH2へ戻っています。
これは自然です。
見出しは、
数字がずっと大きくなっていかなければいけない
わけではありません。
重要なのは、話の親子関係です。
H3から始めたり、H2を飛ばしてH4を使ったりしていい？
ここは避けた方が分かりやすいです。
たとえば本文が突然、
H3：WordPressとは
H2：ブログの始め方
H4：サーバーについて
となっていたら、どの話がどの中に入っているのか分かりません。
H4は、本来H3の中をさらに細かく分けるための見出しです。
なのにH3がないままH4を使うと、構造として不自然になります。
初心者なら、
H2の中にH3。
H3の中にH4。
これを覚えておけば十分です。
見出しをデザイン代わりに使わない
昔ブログを書いていると、
「H2のデザインよりH3の方がかわいい」
ということもあります。
WordPressテーマによって、
H2は太い線。
H3はおしゃれな背景。
H4はシンプルな下線。
というように、デザインが違うからです。
すると、
「この場所はH2だけど、H3のデザインを使いたいな」
と思って、見出しレベルを変えてしまうことがあります。
でもこれは、本来の使い方とは違います。
見出しはデザインではなく構造で選びます。
H2の場所ならH2。
H3の場所ならH3。
デザインが気に入らない場合は、テーマやCSS側で見た目を変更する方が自然です。
文字を大きくしたいだけなら見出しを使わない
これも同じです。
本文の一部分を目立たせたいから、
「H3にすれば文字が大きくなる！」
と見出しにしてしまうことがあります。
でも、その文章が見出しではないなら、H3を使う必要はありません。
文字を大きくする。
太字にする。
背景色を付ける。
ボックスで囲む。
こうした見た目の変更は、装飾機能やCSSで行います。
見出しは、
「ここから新しい話が始まります」
という意味で使うものです。
H2の次にH4を置くのは？
基本的には、H3を飛ばしてH4へ行かない方が分かりやすいです。
たとえば、
H2：WordPressテーマについて
H4：無料テーマ
H4：有料テーマ
ではなく、
H2：WordPressテーマについて
H3：無料テーマ
H3：有料テーマ
の方が自然です。
もし、
H2：WordPressテーマについて
H3：無料テーマ
H4：無料テーマのメリット
なら、H4には「無料テーマ」というH3の下位項目として意味があります。
数字ではなく、
親の話と子の話
として考えると分かりやすくなります。
見出しだけ読んでも記事の内容が分かるようにする
見出しを作るときは、記事本文を全部読まなくても、
見出しだけで大体何について書いてあるか分かる
状態を目指すと使いやすいです。
たとえば、
H2：SEOタイトルとは？
H2：記事タイトルとの違い
H2：SEOタイトルは公開後に変更できる？
H2：SEOタイトルの文字数は？
と並んでいれば、記事の内容がすぐ分かります。
見出しはSEOだけのためではありません。
長い記事を読む人が、
「自分が知りたいところはどこかな？」
と探すための案内板でもあります。
WordPress初心者なら、この形で覚えれば大丈夫
ここまでいろいろ説明しましたが、最初から難しく覚える必要はありません。
WordPressブログなら、まずは、
H1：記事タイトル
H2：大きな話題
H3：H2の中の小さな話題
H4：H3をさらに細かくするとき
これだけ覚えておけば十分です。
そして、
本文はH2から始める。
これも覚えておく。
あとは記事を書きながら、
「これはH2の新しい話かな？」
「それとも今のH2の中の話だからH3かな？」
と考えれば、自然に見出し構造を作れるようになります。
SEOタイトル・記事タイトル・H1を整理すると簡単
最後に、混乱しやすい3つを整理します。
SEOタイトル
検索エンジンへページタイトルを伝えるためのタイトル。
記事タイトル
WordPressで投稿につけるタイトル。
H1
ページ内で、そのページの一番大きな主題を示す見出し。
WordPressでは、
記事タイトルがH1になる
ことが多いです。
SEOタイトルも同じ文章でよければ、そのまま使って大丈夫です。
だから初心者のうちは、
記事タイトルを決める。
↓
それがH1として表示される。
↓
本文はH2から書く。
これくらいシンプルに考えて構いません。
見出しは「文字の大きさ」ではなく「記事の設計図」
H1、H2、H3という言葉を見ると、難しいHTMLの話に感じます。
でも考え方は単純です。
本でいえば、
本のタイトル。
章。
節。
さらに細かい項目。
それをブログ記事で表しているだけです。
だから、
「こっちの見出しデザインがかわいいからH3」
ではなく、
この記事の中で、この話はどの位置にあるのか。
それで見出しを選びます。
H1は記事タイトル。
本文はH2から。
H2の中を分けるならH3。
さらに必要ならH4。
まずはこの順番だけ覚えておけば、WordPress初心者でも十分です。