こんにちは。和雨（@waublg）です。
今回はブログに置ける見出しの付け方・装飾の仕方について解説します！
あなたは見出しをちゃんと使っていますか？
見出しは飾り付けの一部だと思っていたなら、その考えは今すぐ変えましょう！
見出しがない＝読まれない
読まれない⇒収益が出ない
見出しがないというのは、こんな未来の原因になります。
SEOにおいても必須なので、見出しがないということは致命的な欠陥と言えます。
という訳で、今回の記事では
- 見出しの必要性
- 見出しの付け方
- 見出しの装飾
- 見出しのルール
について解説していきます！
▼このブログと同じWPテーマ▼
ブログに見出しは必須
読者さんは「読みたくない」
冒頭でも話しましたが、「見出しがない＝読まれない」です。
突然ですが、想像してみてください。
あなたがGoogle検索をしたときに表示されたページが、文章がずーっと続いているだけだったとき。
あなたはどうしますか？
すぐに戻るボタンをおして、別の検索結果を開きますよね？
読者さんは少なくとも、読みやすくて分かりやすい他の記事があればそっちに行っちゃいますよね。
基本的に読者さんは、意識的かどうかはともかく「できるだけ読みたくない」と思っています。
あなただって面白い小説ならともかく、文字ばっかりの解説記事なんて読みたくないと思いませんか？
今のインターネット上には、見やすくて分かりやすい記事が沢山あります。
そんな中で見出しすらない見にくいブログでは、正直勝ち目がありませんよね。
SEOにも必須
見出しはSEOにも必須です。
なぜなら、Googleなどが作っている記事を確認して評価するロボットは、見出しから文章の構成を把握します。
それなのに見出しがなかったらどうなるでしょうか？
「意味不明なコンテンツ」と言われてしまいかねないんです。
「少なくとも読者のことを考えていないコンテンツ」と評価をされることは間違いありません。
当然SEOとしての評価は下がってしまいますので、見出しは必須と言えるでしょう。
このように見出しはブログにおいて絶対に付けなきゃいけないものです。
以降で紹介する見出しのつけ方を覚えて、しっかりと扱えるようにしましょう！
見出しのつけ方
見出しのつけ方ですが、あなたがどの環境を使っているかによって変わってきます。
それぞれ見出しの使い方を紹介していきますね。
ワードプレス：Gutenbergの場合
Gutenbergとは、ブロック単位で文字を装飾しながら作っていくワードプレスのエディタのことです。
ちょっとややこしい説明になってしまいましたが、以下のような画面で編集するのがGutenbergです。
Gutenbergで見出しを付ける場合は、
- “＋”をクリック
- “見出し”をクリック
- 見出しレベルを選択
- 見出しに入れる文字を入力
見出しレベルってどうやって決めるの？
この後に出てくる”見出しのルール”の章で解説しますね！
ワードプレス：クラシックエディタの場合
クラシックエディタは以下のような画面で文字を装飾するエディタです。
これがクラシックエディタですね。
クラシックエディタの操作は簡単で、
- “段落”をクリック
- 見出しレベルに合った見出しを選択
これだけです！
HTMLで書く場合
まぁこれは正直やる人はほとんどいないと思いますが、一応HTMLで書く場合の方法を紹介します。
HTMLで書く場合は、”<h2>見出しのテキスト</h2>”のように書きます。
ここからh2, h3のように数字を変更すると、見出しレベルを変えることができます！
h1=見出し1, h2=見出し2となります。
HTMLではこの”<〇〇> </〇〇>”をタグと言い、タグで文字を囲うことによってその文字を装飾していきます。
基本的な使い方は以上です！今度はこれをどのようなルールで使っていけばいいのかを紹介します。
見出しのルール
見出しレベル
見出しにはいくつかルールがあり、それにのっとって機械的に見出しレベル等を割り当てていきましょう。
まず見出しレベルについてですが、見出しには階層がありh1, h2, h3, h4…のようになっています。
h1の中にh2があり、h2の中にh3があり……と続いていきます。
イメージとしては以下の通りです。
このように、入れ子の構造で作っていきます。
また、実際のブログの文章もこれにのっとった構成で書く必要がありますので、見出しを組み立ててからそれを元に文章を組み立てるようにしましょう！
最初はh2から
見出しレベルの説明を見るとh1からに見えますが、実際にはh2から使っていきます。
というのも、h1というのはタイトルのことだからです。
あなたが意識していなかったとしても、タイトルを書いた時点でh1が使われているんですね。
1記事の中にh1が複数ある（＝タイトルが複数ある）ということはあってはならないので、h1を自分でわざわざ使う必要がないのです。
ですので、見出しはh2からはじめましょう！
見出しのテキストは検索キーワードを入れる
こちらはルールというよりも、SEOのための工夫になります。
先ほどロボットが見出しから文章の構成を把握すると説明しましたが、その見出しに検索キーワードが入っていると
「この検索キーワードに合ったコンテンツを書いているんだな」とロボットが判断します。
これによって、見出しに入れたキーワードに対応したコンテンツとして検索結果に表示されやすくなるなるので、SEOの効果が期待できます。
ちなみに検索キーワードとは、Googleなどで検索するときに入力するキーワードの事です。
「ブログ 見出し」で検索したとき、「ブログ」や「見出し」について書かれている記事が検索結果に表示されますよね。
これが検索キーワードです。
検索キーワードの把握するやり方が分からない方は、以下の記事も参考にしてくださいね。
和雨（わう）です。あなたはブログの検索キーワードって意識していますか？今回の記事ではそんな方へ向けて、検索キーワードの調べ方と活用方法を紹介します！ちなみにこの記事では、ラッコキーワ[…]
見出しの装飾
見出しを使ってみたんだけど、正直見た目が微妙……
それなら、カスタマイズしてみましょう！
見出しはあなたのブログに合うようカスタマイズすることができます。
基本的にはテーマの外観設定で好きなように装飾できて、CSSなどのコードを書く必要はありません。
色や見え方などのデザインを変更することができるので、あなたのブログにあったレイアウトを設定しましょう。
見出しレベルの違いが見た目でわかるようにするのがポイントです！
反映されないときは
見出しを設定したのに反映されないんだけど……
もし見出しの設定を変えたのに反映されないという不幸に見舞われた場合、キャッシュを疑いましょう！
キャッシュとはWebページを素早く表示できる工夫で、直前に表示した画面の情報を一時的に保存しておき、次に表示するときはそのデータを使って素早く表示できるようにする機能です。
ですので、このキャッシュが悪さすると設定を変更するまえの画面を保存データから再表示してしまうので、反映されていないように見えてしまいます。
これを解消するにはスーパーリロードをしましょう！
スーパーリロードをするにあｈ、ブラウザ（ChromeやSafari, Edgeなど）の画面で、OS別にキーボードの以下のキーを押します。
- Windowsなら以下のどれかを実施
- 「Ctrl」を押しながら「F5」を押す
- 「Ctrl」を押しながら「R」を押す
- 「Ctrl」と「Shift」を押しながら「R」を押す。
- Macなら以下のどれか
- 「Command」を押しながら「R」を押す。
- 「Command」と「Shift」キーを押しながら「R」を押す。
キャッシュが悪さしている場合は、これで解決されます。
もしこれでも反映されていないときは、もう少し詳しく調査が必要になります。。
まとめ
見出しについての説明は以上です！
見出しが必要不可欠であることはご理解いただけましたか？
装飾の仕方はともかく、見出しを使うときは以下のことを注意していれば大丈夫です。
- 入れ子構造で見出しレベルを決める
- 見出しはh2から（タイトルがh1だから）
- 見出しには検索キーワードを入れるようにする（SEOになる）
読者さんに読んでもらえるコンテンツや検索エンジンに好かれるコンテンツを作るうえで、記事の構成というのは基礎の基礎でいちばん重要とも言えることです。
その構成の基本となるのが見出しです。
ここでしっかり使えるようにして、これから素敵な記事を沢山書いていってください！
今日の記事では、ブログ記事の基本的な書き方について解説します！その中でも解説するのは面白い文章を書くスキルではなく、主に記事の構成についてです！これができることによって、以下のような利点があります。読みやす[…]