ブログ記事の書き始めはh2タグ?h1タグ?どちらのHタグを使えば良いのか徹底解説!

記事の書き始めはh2かh1のどちらを使う?_eyecatch

ブログで記事を書き始める時に使うのはh1タグ?それともh2タグ?

あるサイトにはh1タグから順番に使っていきますと書かれていたり、別のサイトにはh2タグから書き始めましょうと書かれていたり…結局どっちなのか?
ブログをはじめたての初心者の方にも分かりやすく解説していきます。

今回は特に人気があるWordpressをメインにした解説ですが、他のCMSを使っている方にも参考にしていただける内容かと思います。

基本はh1から書き始めます。が、WordPressはh1を自動出力するので注意!

記事の書き始めはh1とh2のどちらを使えば良いのか?

HタグはH1~H6までの6種類があり、SEOにおいて最重要のタグとなっています。

ブログ初心者の方はまずHタグの使い方だけ覚えましょう!といたるサイトで書かれているくらい重要なタグですが、いざ記事を書こうとしたらH1から書き始めて良いのか迷うことがあると思います。

記事の書き始めはh2かh1のどちらを使う?_001

ブログの書き始めはh1?それともh2?

特にWordpressの場合は投稿画面の記事タイトルが自動出力されることもあり、実際に書いた文章が表示されるのはページ上部から少し下になるので、余計にややこしくなりますよね…。という事で詳しく解説します。

ブログはh1とh2のどちらから書き始めるか?先に結論を書くと以下です。

結論

〈基本:Webサイトはh1タグ(大見出し)から記事が始まる。〉

  • WordPressを使っている場合:h2タグから書き始めればOK!
  • 静的サイトやWordPress以外:h1タグから書き始める事がある。

Wordpressならh1タグが要らないのではなく、元々あるという感じです。

テーマや環境によってはWordpressでも例外があるかもしれませんので、この記事では自分のサイトではh1から書くのか、h2から書くのかを確認する方法もご紹介!

ぜひ最後までお読みいただければと思います・w・

留意点

この記事はh1タグを1ページにつき1つ使うことを前提としています。
一応h1タグに使用上限はありませんが、1ページ1つが定石なので。
(h1を2つ以上使っているサイトはめったに見ません。特に検索上位)

各Hタグの使い方はここでは最低限にします…調べれば沢山出ますのでね!

HTML的にはh1タグから書き始めるのが正解

まずHTMLタグの基本構造について確認しておきましょう。
(面倒or分からない人は読み飛ばして下さい!)

超簡単にWebサイトのHTMLタグ例を示すと以下のような形がテンプレです。
基本はこの順番にHTMLタグが存在します。

<html>
  <head>
  <title>タイトルタグ</title>
  </head>
    <body>
      <h1>h1タイトル</h1>
      ほげほげ・・・
      <h2>h2見出し</h2>
      ほげほげ・・・
    </body>
</html>

上記の<body>から</body>の間がサイトコンテンツ(記事)が入るところです。
ここにH1~h6までの見出しタグを必要なだけ使います。

h2→h1という使い方はダメで、h1→h2…と順番に使う必要があります。

また<body>外の<head>から</head>の間にtitleタグがありますが、titleタグはh1と勘違いされやすいタグなので記事の後半で触れます。

今回の焦点は「記事の書き始めはh1から?それともh2?」というところなので、重要なのは自分のサイトでh1が自動出力されるのか、それともh1を自分で書く必要があるのかを知ることです。

スポンサーリンク

WordPressなら記事はh2タグから書き始める

Wordpressを使っているなら、記事の書き始めはh2タグから書きます。
なぜならWordpressは記事タイトルからh1タグを自動出力するからです。

記事の書き始めはh2かh1のどちらを使う?_002

Wordpressは記事タイトルからh1タグを自動出力する

どのようなサイトでも記事の冒頭にはh1(記事タイトル)があると思いますが、これがWordpressだと記事タイトルから自動で出力されます。

つまりWordpressで実際に記事を書いていくところは<h1>タグの後ということです。

ポイント

画像は旧エディターですが、これは新しいブロックエディターのGutenbergでも同じです。

記事の書き始めはh2かh1のどちらを使う?_003

<h2>タグの前にリード文を入れてもOK

Wordpressなら記事の書き始めはh2タグから。と書きましたがリード文などの文章を入れてからh2タグを使っても大丈夫です。当サイトもそんな感じです。

今までWordpressでh1タグが自動出力されないパターンは見たことがないのですが、念のため記事タイトルがh1になっているか確認できる方法をご紹介します。

Chromeでタイトルがh1かどうか確認する方法

本当に自分のサイトはh1タグから始まっているのか…
SEOにおいてHタグは最重要なタグということもあるので、自分で確認するまで安心できないというのが人というものです。

ということでChromeを使ってタイトルが本当にh1タグになっているかどうかを確認する方法をご紹介します。

参考

Chromeを使いますが、他のブラウザでも似た操作で同じことができます。

Chromeでサイトを開き、画面上で右クリックを押す

まずはChromeで確認したいサイト(自サイト)を開きましょう。

記事の書き始めはh2かh1のどちらを使う?_004

調べたいサイトで右クリック→検証を押す

サイトが開いたら、画面上(画像などがないところ)で右クリックを押し、メニューから「検証」を押します。

デベロッパーツールが起動したら、検査を押す

記事の書き始めはh2かh1のどちらを使う?_005

デベロッパーツールの検査ボタン()を押す。

Chromeのデベロッパーツールという検査用のツールが開くので、画面内にある検査ボタン()を押します。

調べたい要素にマウスカーソルを当てる

これでマウスカーソルを置いた部分の要素を調べることができます。

記事の書き始めはh2かh1のどちらを使う?_006

記事タイトル部分にマウスカーソルを当てる

あとは記事タイトル部分にマウスカーソルを置いてみましょう。
するとh1というのが確認できました。これがWordpressが記事タイトルから自動挿入したh1タグですね。

ポイント

h1の後ろの.entry-titleはCSSのクラス名です。
このようなクラス名が付いていてもh1タグです。

お分かりかと思いますが、マウスカーソルを動かせば他のタグも確認できます。

記事の書き始めはh2かh1のどちらを使う?_007

マウスカーソルを動かして色々なタグを確認できる

記事冒頭に入れたリード文はpタグになっているという事も確認できますね。

h1に続く見出しがh2になっているか確認する

記事タイトルがh1タグになっていることを確認したら、その後に続く見出しがh2タグになっているかも確認しましょう。

記事の書き始めはh2かh1のどちらを使う?_008

自分で挿入した見出しがh2になっていることを確認する

これでh1(記事タイトル)→pタグ(リード文)→h2(見出し)…
という順番にタグがあることが確認できました。

心配なら他のサイト様も覗いてみましょう!大体この順番になっているはずです。
なお、1つ目のh2の後にh2を使うかh3を使うかは人によって違う感じです。

h1タグの複数回使用には注意が必要

記事の書き始めにh1タグを使っている時は下の画像のようになります。

記事の書き始めはh2かh1のどちらを使う?_009

h1タグは1ページにつき1つが定番!

h1(記事タイトル)→pタグ(リード文)→h1(見出し)…という順番です。

画像にはNGと書いていますが、ダメではありません…非推奨なだけです。
とにかくh1タグは1ページにつき1つが無難です。これ本当に。

初心者の方や、SEOに詳しくない方で、明確な意図がなく記事冒頭からH1タグを2つ以上使っているなら修正した方が良いかもしれません。

以上の方法で記事冒頭のhタグを確認すれば、サイトでh1タグを自分で挿入する必要があるのか否かが分かります。

Wordpressならh1タグを自分で書く必要はありませんが、他CMSや、静的サイトでHTMLを直書きしているなら、h1タグを自分で挿入する必要があることもあります。

WordPressはtitleタグも自動出力する

最後にh1タグと関連性があるtitleタグというものについてです。

Wordpressは記事タイトルからh1タグの他に、titleタグも自動出力します。
titleタグは「ページタイトル|サイト名」という感じでHTMLの<head>間に自動出力されます。(テーマによって変更されていることもあるのですが…)

記事の書き始めはh2かh1のどちらを使う?_010

Wordpressはh1タグ以外にtitleタグも自動出力する

このtitleタグが何かというと、検索結果に表示されるページタイトルです。
そしてこのtitleタグはブラウザのタブに表示されるページタイトルでもあります。

h1タグは閲覧者用のタグという感じなのに対して、titleタグは検索エンジン用のタグというイメージです。だからHTMLの<body>間ではなく<head>間にあります。

記事の書き始めはh2かh1のどちらを使う?_011

titleタグを書き換えた様子(titleタグとh1タグは別物)

上の画像はChromeでtitleタグを書き換えた様子です。
ブラウザのタブのタイトルは変わっていますが、記事の見出しは変わっていません。

titleタグとh1タグを違う内容にすれば、記事中のページタイトルと検索結果に表示されるタイトルを違うものにするのも可能ですが、大きくズレるとSEO的にダメです。

そんな理由もあってか「記事タイトル」=「h1タグ」≒「titleタグ」となるように、Wordpressではh1タグとtitleタグが記事タイトルから自動挿入されます。
h1タグとtitleタグはその性質上、同じ文字が入ることが多いのでこの仕様で良いのですが、ついでに知っておいていただければと思い最後に書きました。

もしもh1タグを複数使っているなら、2つめ以降のh1タグはタイトルとしては扱われないので注意しましょう。この点でもh1タグは1つがお勧めですかね。



まとめ

以上、ブログの書き始めに使うHタグはh1か?h2か?迷った方へ向けた記事でした。

Webサイトはh1タグから書き始めるのですが、人気CMSのWordpressの場合は自分で<h1>~</h1>というコードを書く必要はありません。

Wordpressでは記事の書き始めにh1タグを使うと、h1タグがページに2つ存在する形になるのでご注意ください。

えぇ…かく言う僕も初めての時は迷いました・w・
その時は、調べても“Wordpressならh2から書くのが正解!!”と背中を押してくれる記事が出てこなかったので記事にしてみました。

では記事の執筆頑張って下さい!

-サイト構築
-

site-logo
ありがとうございました!
良かったらシェアしてネ・w・
当サイトはピンバックを受け付けます。
  • この記事を書いた人
ザキ

ザキ

X:@sologaku

プログラミングに興味があり情報系の大学を卒業。

新卒で社会人になるも数年で退職し今はフリーランスとして生きています。

少しでも誰かの役に立てれば...と思い、当サイトでIT関係のハウツーを発信しています。


ソロ学運営者:ザキの自己紹介

© 2020 sologaku