ほとんどのブログ記事は、見出ししか見られていないというほど、重要な文章です。ですが、まず「見出しって何？」「どうやって見出しを付けるの？」というところからして、わからないブロガーの方も多いのではないでしょうか。

そこで、見出しというものについて詳しく解説していきます。

見出しって何？なんで見出しを付けるの？

見出しは、記事の内容の要点を短い言葉にまとめてあるもので、記事の先頭に大きな字で目立つように書かれています。書籍においては索引などに使われる、目次としての意味もあります。

新聞や雑誌を読むときは、まず見出しを読んでそこに何が書かれているかを確認します。ブログでも、同じように分かりやすい見出しを入れることで、どんな内容の記事なのか読者に伝えることができます。また書籍・索引などに使われる目次としての意味もあります。

そらいろくらげは、ブログを始めてから10年近く見出しを付けていませんでした。いろんなジャンルのブログを読んでいて、ふとあるブログを読んでいる時に見出しがあると読みやすいなと思ったのがキッカケでした。

見出しがない文章は、ただの文字の塊に見えてしまい読む気を失います。文字の塊に見出しを付けるだけで、各見出しごとに要旨がわかるため読みやすさが段違いに増します。

見出しのあるメリットは以下の通り。

• 文章が読みやすくなる

• どこに何が書いてあるのか一目瞭然でわかる

• SEO対策になる

• 文章が書きやすくなる

本や雑誌を読むときには、まず目次を見るという方も多いでしょう。ブログ記事の見出しは、その記事の目次になります。目次が作られることで、「この記事はどれくらいの長さなのか」「自分が知りたい情報がどこにあるのか」がひと目で分かります。目次を入れるだけで、ユーザビリティの向上につながるのです。

また、見出しは検索エンジンに記事の内容を正確に伝えることができるため、検索上位に上がりやすくなります。見出しを付けるだけでSEO対策につながるのです。

書く側にとっても、見出しは文章を書く道標になります。見出しで各章に分けてブロックを作ることで記事がまとまりやすくなり、「あれ？結局何を書きたかったんだけ？」「結論を書くの忘れた」「話が脱線してしまった」ということを防いでくれます。

見出しの使い方

見出しの役割と重要性がわかったところで、実際に見出しを付けていきます。

ブログ記事への見出しの付け方は、HTMLタグを使用します。そのため、普段からウィジウィグエディタ（HTMLが表示されず、書いたものがそのまま表示されるモード）で書いている方はHTMLエディタに変えてください。

noteは見出しにしたい部分をドラッグで選択するとポップアップが出てくるので、見出しの項目を「大見出し」「小見出し」のどちらかを選択してください。

見出しの種類は4つある

Webでの見出しの場合は４段階に分かれていて、表記にはHTMLタグを使用します。

• <h1>記事タイトル</h1>

• <h2>大見出し</h2>

• <h3>中見出し</h3>

• <h4>小見出し</h4>

ほとんどのブログではタイトルに使う<h1>は、投稿ページのタイトル欄にタイトルを入れれば自動的に生成されるため、使いません。実際に使うのは<h2>以降のタグです。

大見出しは記事の要約を入れる

大見出しは、章ともいいます。見出しの文章を<h2></h2>というタグで囲っています。ブログ記事の各章ごとに入れるのが大見出しです。

中見出しとは

中見出しは、節ともいいます。見出しの文章を<h3></h3>というタグで囲っています。章の中でさらに詳しく説明をしようとする場合などに使います。
この記事では、「見出しの種類は4つある」と「見出しのデザインを整えよう」で使用しています。

小見出し

小見出しは、項ともいいます。見出しの文章を<h4></h4>というタグで囲っています。h3で説明したことをさらに細かく説明したいときに使いますが、めったに使うことはありません。

この他にH6まで見出しはありますが、本文中で使うのはH2とH3だけです。

タグを付けたときは、その見出しの最後にかならず</h2>というように閉じタグを入れてください。そうしないと、その後に続く文章がすべて見出しになってしまいます。

見出しのデザインを整えよう

ブログサービスによりますが、テンプレートによってすでに見出しデザインが設定されていたり、ただ文字の大きさを変えるだけの場合もあります。そのまま使っても問題ありませんが、ブログデザインに合わせて見出しのデザインや色を変えることができます。

見出しのデザインや色を変更するのに必要なのが、CSS（スタイルシート）です。ネットで、「見出し　CSS」や「見出し　デザイン」などで検索すると、いっぱい出てきます。いろいろなデザインを試してみるのもよいでしょう。

ただし、スタイルシートをいじる場合は、最初にテンプレートを複製しておくか、バックアップを取っておくのをお忘れなく。一度いじって保存したら元に戻せません。複製の方法がわからなければ、スタイルシートのコードを全てコピーしてメモ帳やテキストエディタに貼り付けておいても大丈夫です。

色を変更する場合は、CSS内のカラーコードを変更します。カラーコードは、”color:#00afec;”というように表記していて、#以降の英数字を変えると、色が変わります。

英数字だけ見ても全然わからないと思うので、カラーコードのサイトをいろいろ参考にしてみるとよいでしょう。
HTMLカラーコード

ただ色を好きなように変更するだけだとちぐはぐになってしまうので、配色の見本を参考にするとすっきりまとまった配色にできます。

読まれるための見出しの付け方

見出しを考える前に、まずは大まかな記事の構成と設定を決めておきましょう。これを決めておくことで、見出しを考える手助けになるだけでなく、記事の方向性も定まります。

• 誰に伝えたいのかを考える

• 文章全体の構成を考える

• 章ごとに何を中心に伝えたいのかを考える

• 目次だけで概要がわかるように構成する

• どこまで踏み込むかを考える

• 簡潔にまとめる

まずは伝える相手を決めておきましょう。広く浅くを目指すよりは、具体的なターゲットを決めたほうが書きやすいだけでなく、よりターゲットに読まれやすくなります。
この記事の場合は、ブログ初心者に向けて書いています。記事を伝える相手が決まっていると、記事のタイトルや見出しの文章が決まってきます。

次に、かんたんに構成を考えましょう。一般的な構成としては、文章の冒頭部分には、「なぜこの記事を書こうとしたのか」や問題提起などを書いていきます。

続いて、冒頭部分で書いた内容を発展させていきます。読む相手に何を中心に伝えたいのかを考えてみましょう。その伝えたいことを短く要約して見出しにします。
「見出しは6種類に分類される」といった具合に内容をさくっと明快に短く切り取ったものや、「見出しは、見る側にとっても書く側にとっても大切」といった具合に、その章の結論でも構いません。

目次を書き出していくと、だいたいの文章の構成が決まってきます。目次を読んだだけで文章の要約がわかるように構成していきましょう。

最初のうちは大見出しだけでも充分です。試しに、今まで書いた記事に大見出しを付けてみてください。文章を見出しごとに区切るだけでも、かなりすっきりまとまった感がするはずです。そのうち、ブログ記事を書くときに見出しを含めた文章が浮かぶようになってきます。

それで慣れてきたら、大見出しだけでは足りない、この章は中見出しも入れたほうがいいかもしれないと感じるようになるはずです。そしたら中見出しを付けてみてください。

まとめ

見出しに付ける文章を考えるのは慣れです。書いているうちに浮かんでくるようになります。また、デザインをいじるのも最初はわけが分からなくて難しいのですが調べたり動かしているうちに覚えます。

なので、難しいことは考えずに何はともあれやってみてください。