hタグとは、heading（見出し）を意味するHTMLタグで、ネット記事などのWEBコンテンツに必要不可欠なパーツです。
クライアントからhタグを設定するように言われたけど、hタグってなに…？
どうして必要なの？
WordPressブログを運営しているけど、＜h1＞タグとタイトルタグの違いが分からない…。
hタグについて詳しく知りたいな。
この記事では、hタグでお悩みの方に向けて、hタグの意味や使い方、タイトルタグとの違いをご紹介します。
現役WEBライターの筆者が、hタグに関するよくある質問にも答えるので、ぜひ参考にしてみてください。
hタグとは
hタグとは、heading（見出し）を意味するHTMLタグで、WEBページを形作るためのパーツの一種です。
新聞や雑誌で、記事の内容を伝えるために使われる「見出し」と同じように、hタグはWEBページの概要を示すために使われます。
hタグには、＜h1＞タグから＜h6＞タグまで、6つの種類があり、数字が大きいhタグほど、重要度が高く、総括的な見出しとなります。
hタグを使うメリット
WEBページで、hタグを使うメリットは大きく分けて2つあります。
記事の要点が分かりやすい
記事に見出しを付けることで、「なにを解説した文章なのか」「重要なことはなにか」が、一目で分かります。
また、WEBコンテンツでは、hタグを設定することで、視認性が良くなり、ユーザビリティ向上の効果も。
以下に、hタグを使用した文章と、すべて本文で構成された文章を用意しました。
いかがでしょうか？
内容は全く同じなのに、記事の読みやすさ・分かりやすさが格段に違いますよね。
さらに、Wordpressを使用したブログでは、hタグの内容が「目次」へと自動で反映されます。
記事のはじめに目次が掲載されていることで、よりユーザーに記事の要点や内容が伝わりやすくなるのです。
検索エンジンのロボットが記事を把握しやすい
hタグを設定することは、SEO（検索エンジン最適化）の観点でも重要です。
作成したWEBコンテンツを、検索結果一覧に表示させるには、検索エンジンのロボットに、そのWEBコンテンツを発見（クロール）してもらう必要があります。
しかし、hタグが設定されていないWEBコンテンツは、ロボットにとっても読み込みにくく、最悪の場合、検索結果に反映してもらえないことも。
特に、＜h1＞タグは、ロボットがWEBコンテンツを把握するための重要な要素となるので、必ず設定しておくようにしましょう。
SEOや検索エンジンのロボットについてさらに詳しく知りたい方は、こちらの記事をご覧ください。
hタグを使用するときのルール
hタグには、＜h1＞から＜h6＞まで、6つの種類があります。
ここからは、それぞれのhタグを、適切に使うためのルールをご紹介します。
数字が大きいｈタグほど、重要度が高い
hタグは、数字が大きいほど、重要度が高く、総括的な内容となります。
＜h1＞から＜h6＞まで、それぞれのhタグの役割や使用頻度を以下の表にまとめました。
| hタグ | 役割 | 使用頻度 |
|---|---|---|
| ＜h1＞ | 記事のタイトルにあたる見出し。記事全体のテーマを示す | 必須 |
| ＜h2＞ | 記事で伝えたいこと。要点。 | 必須 |
| ＜h3＞ | ＜h2＞で発生した分岐や、＜h2＞に関する詳細。 | 高い |
| ＜h4＞ | ＜h3＞の補足。 | 時々 |
| ＜h5＞ | ＜h4＞の補足。 | 少ない |
| ＜h6＞ | ＜h5＞の補足。 | 少ない |
このように、数字の大きなhタグは、記事の中での重要度が高く、数字が小さくなるほど、補足としての役割が強まっていきます。
補足の多い記事は、長文になりやすく、テーマを見失う原因にもなるため、WEBライティングでは、＜h4＞タグまでの使用が一般的です。
hタグは順番に使う
hタグは、大きな数字のものから、小さな数字のものへと順番に使っていくことが重要です。
記事の冒頭で、いきなり＜h3＞タグを使用するような用法では、ユーザーや検索エンジンのロボットを混乱させてしまいます。
以下の画像は、hタグを正しく使った記事の構造図です。
上から＜h1＞→＜h2＞→＜h3＞→＜h4＞の順番で使われていることが分かりますね。
このように、hタグを正しく使った記事は、大きな数字のhタグが、より小さな数字のhタグを包みこむ、マトリョーシカのような構造（入れ子構造）になります。
記事を作成する際には、必ず＜h1＞タグから始め、数字の順番を守るようにしましょう。
＜h1＞タグは何度も使用しない
記事のタイトルにあたる＜h1＞タグは、1つの記事に1度だけ使用するようにしましょう。
検索エンジンの最大手であるGoogleでは、SEO対策に有効な見出しの数は定められていません。
しかし、全体のテーマを示す＜h1＞タグが、2回以上登場する記事は、やはり不自然です。
どうしても＜h1＞タグを複数回使いたい場合には、新たなページを作成し、記事を分けるようにしましょう。
＜h1＞タグとタイトルタグの違い
ここまで、＜h1＞タグは、記事のタイトルにあたる見出しだと、解説しました。
しかし、WEBページを形作るHTMLタグの中には、「タイトルタグ」と呼ばれるタイトルを設定するためのタグも存在します。
同じように思える＜h1＞タグとタイトルタグですが、表示される位置とその役割に大きな違いがあるのです。
| ＜h1＞タグ | タイトルタグ | |
|---|---|---|
| 表示される位置 | 記事を開いた時の最上部 | 検索結果一覧など |
| 役割 | ページを訪れた人に対して記事のテーマを説明する | まだページを訪れていない人に記事のテーマを示し、興味を持ってもらう |
＜h1＞タグは、WEBサイトの上部に記載される一方、タイトルタグを設定した文章は、以下の画像のように、検索結果一覧で表示されます。
このように、＜h1＞タグとタイトルタグは、表示位置と役割で使い分けられており、WEBコンテンツを作成する際には、どちらも設定する必要があります。
WordPressの＜h1＞タグはどこ？
WordPressブログをお使いの方の中には、
hタグを設定する重要性は分かっているけど、＜h2＞タグ以降しか見当たらない…。
＜h1＞タグはどこで設定できるの？
と疑問に感じている方もいらっしゃるのではないでしょうか。
実は、Wordpressのブログでは、「新規投稿を追加」ボタンを押すと、ページ上部に表示される「タイトルを追加」の部分が、＜h1＞タグになっています。
＜h1＞タグをわざわざ呼び出す必要がないため、便利な仕様ですが、意外と知らない方も多いはず。
ちなみに、タイトルタグは、編集画面の下部の「SEOタイトル」から設定できます。
hタグに関するよくある質問
ここからは、hタグに関するよくある質問に答えます。
hタグに画像を使うことはできる？
hタグに画像を使用することは可能です。
hタグを画像にする場合には、以下のことに気を付けましょう。
- ALT属性を設定する
- 同じ画像を繰り返して使用しない
- 無関係な画像を使用しない
特に重要なのは「ALT属性（代替テキスト）を設定する」ことです。
検索エンジンのロボットは、画像に書かれた文字や情報を認識することができません。
そこで、画像について説明するテキスト＝ALT属性を設定して、ロボットが情報を読み込めるようにしてあげる必要があります。
hタグの最適な個数はいくつ？
hタグの個数に決まりやルールはありません。
Googleでは、hタグの最適な個数について、以下のように発表しています。
ページごとに魔法の見出し数や理想的な見出し数といったものが存在することもありません。
引用元：検索エンジン最適化（SEO）スターター ガイド
しかし、記事のタイトルにあたる＜h1＞タグは、ユーザビリティーの観点から、ひとつの記事につき1回の使用を心掛けましょう。
hタグの文字数はどれくらいがいいの？
hタグの文字数についても、決まりはありません。
しかし、記事のタイトルにあたる＜h1＞タグや、記事の要点を伝える＜h2＞タグでは、一目で内容が理解できる完結な文言が好まれます。
具体的に文字数を示すと、
- ＜h1＞タグは30文字前後
- ＜h2＞タグは、15文字以内
を目安にすると良いでしょう。
また、＜h2＞タグ以下のhタグでは、補足の役割が強くなるため、文字数が伸びてしまうことも考えられます。
見出しが長くなり、読みづらい場合には、以下のように＜br＞タグを使うことで、改行が可能です。
まとめ
今回は、WEBライティングで使われるhタグについて、言葉の意味や使う理由、使用のルールなどを解説していきました。
hタグとは、headingを意味するHTMLタグで、新聞や雑誌の「見出し」と同じ役割で使われます。
hタグを使用する際のルールをもう一度確認すると、こちらです。
WEBコンテンツを作成するときに、「効果的な見出しが思いつかない…」という方は、記事構成の方法を見直してみましょう。
正しい記事構成の考え方については、こちらをご覧ください。
