【SEO対策】[section]等にそれぞれ [h1]等のhタグを入れて使う仕様について

  • 公開日2018/01/29
  • SEO

ここ数年、[section]や[article]に、それぞれ[h1]等のhタグを入れるようにhtmlを記述してきました。正確には、[section]等が追加された、html5に変わった時(2014年の10月28日)に、section, article等にそれぞれ[h1]等のhタグを入れて使う仕様になったので、それから今まですね。ですが、html5.1に変わった時(2016年11月1日:HTML5.1勧告版(正式版)が公開)、に、その項目は削除され、昔の仕様に戻ったんだそうです。

要は、ここ数年(2014/10/28〜2016/11/1)問題のなかったこのような記述が、

<div class="wrapper">

 <h1>このページのH1</h1>
 <h2>このページのH2</h2>

 <section>
  <h1>このsectionのH1</h1>
  <h2>このsectionのH2</h2>
 <section>

 <section>
  <h1>このsectionのH1</h1>
  <h2>このsectionのH2</h2>
 <section>

</div>

今では(2016/11/1〜)ダメということなんですよね。

現在就業中の仕事先のSEO対策で、『H1が複数あるページがあるので、それを修正してほしい』との依頼があり今回の件に気がついたのですが、今までそういう記述で作り続けてきた者にとっては寝耳に水で『ちょっと待ってよ!この約3年間ずっとそういう作りで作ってきたのに!』って感じですよね?っていうか、『そんな大事なことコロコロ変えんといてよ!!』って感じですよね?

ですが決まったものは仕方がない。
ってことで、ブーブー言いながら現在もH1の修正を続けているのですが、今回この件を色々調べたところ、色々なことがわかりました。

Googleのウェブマスターの見解

SEOに関してのhタグについての質問を、John Mueller(Googleのウェブマスター・トレンド・アナリスト)にしている記事がhttps://www.allegro-inc.com/seo/h1-tag-googleにあったのですが、その中の動画では、

『見出しはコンテンツの文脈や構造を理解するのに少しだけ役立つが劇的な効果はない。見出しが正しく使われてなくても、Googleはそれが致命的な問題とは認識しないし、アルゴリズムによって順位を下げるという事もない。
そもそもの意味で、H2の下にH3を配置するのが道理にかなっていると思うのであればそうしても良いし、その為にウェブサイトのデザインをやり直す結果になってしまうのであれば、もっと他に集中すべき重要な点はたくさんあります。』

と解答しているようです。(2015/12/15時点)

html5.3になっていた!

ちなみに、html5.3が、2017/12/14に公開されていました。
https://www.w3.org/TR/html53/

日本語訳されている記事もありましたので、hについて読んでみると、

『Sectioning contentを適切に入れ子関係にすれば、各セクションの見出しを全部h1要素としても、HTML5構文を適切に解釈できるプログラムなら、見出しの階層は適切に判断されるはず。しかし、対応してないプログラムの存在を考慮すれば、HTML文書作成者はこの方式を用いるべきではない。』

HTML5.3各要素別メモより)

とありました。

要は、古いプログラム(ブラウザ)では適切に認識されないかもなので、昔の仕様で作ったほうがよいってことのようですね。

まとめ

そんな訳で、GoogleのウェブマスターのJohn Muellerさんの言葉からすれば、SEO的にはh1がそれぞれのsectionに入っていても、なんらペナルティーはないようですが、今後作っていく際には、h1はそのページに1つにして作っていくべきなのかな。という感じですね。

ちなみに、皆さん(プログラマーやデザイナーやコーダーの方等)がよく参考にしているであろうサイトでも、今回のsection等の中でのhタグの仕様についての記述はそのままのところがほとんどですね。(2018/1時点)そのくらい、この問題は認識されていない?気づかれていない?ようです。
って、毎日htmlの仕様が変わってるかどうかをチェックしてる人なんて、ほとんどいないですよね。それなのに今回のような仕様変更をひっそりとするなんて。。って感じもしますが、ま、こういう事を仕事にしてるのであれば、たまには気をつけてないと。ってことなんですかね。

とりあえず、修正していくのは大変でしょうが、新しいルールを知るきっかけになったので、よかったです。
今後は、たま〜〜〜にはhtmlの仕様のチェックもしたいと思います。

Google AdS



関連記事

☆100達成!PageSpeed Insightsのスコアアップ方法 その4:キャッシュの設定をする


Google「PageSpeed Insights」のスコア(点数)をアップさせる方法 その『4』です! 今回はキャッ…

記事を読む▷


<head>タグの記述例=順番等もきちんと考えた雛形(テンプレート)


一度サイトを作ってしまうと、あまり見直すことのないheadタグ内の記述。新たなLPを作ったりする時でも、以前作ったものの…

記事を読む▷


公開日を最終更新日にする!サムネイル

検索結果に最終更新日を表示させてクリック率をアップする方法!新規投稿時には公開日を表示させる!


以前は検索結果で1ページ目上位3番目以内に半年以上表示されていた記事が、いきなり圏外となってしまいました。Googleの…

記事を読む▷


『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:その1


最近お問い合わせページにちょくちょく迷惑メールがくるようになりました。『Akismet Anti-Spam』も有効にした…

記事を読む▷


Google Analyticsに設定する『グローバルIPアドレス』を確認&取得する方法


で「自分のアクセスを除外」するフィルタを設定し、自分のアクセスはカウントしないようにしていたのですが、ある修正作業をして…

記事を読む▷


Message

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

PAGE TOP