Bodyタグの開始行がSEO的な影響を受ける?

bodytagSEO対策

今回は、HTMLソースにあるBodyタグの位置とSEOの関係性について考察します。

HTMLマークアップについては以下の記事を参照してください。

SEO効果の高いHTML・マークアップ方法【2019 最新版】
SEOを考えた最適なHTMLマークアップについて記載しています。Googleに好まれ、検索上位を上げるために必要なことの一つとして、あなたのWebサイトにも是非ご活用ください。

Bodyタグの開始行とSEOの関係性

Bodyタグとは、ページの中のメインコンテンツ部分のソースを囲むタグのことです。

Googleのクローラーは、ソースを上から下へと順番に読み込んでいくので、まず最初にHeadタグに記載されている「META情報」「インラインStyle」等を読んで、そのあとにBodyタグ(肝心の記事の中身)を読んで行きます。

そのため、Headに書かれている文字が多ければ多いほど、肝心の中身となるコンテンツが入ったBodyタグになかなか辿り着けません。

つまり、Bodyタグの開始行は、できるだけソースの上にあることがSEO的に有利と言えます。

以下は、Yahoo!japanさんのトップページのソースです。

bodytag-gyou

Bodyタグの開始行は、40行目ですね。
これは、なかなかいいですよ。

具体的に何行目が理想なのか・・というと難しいのですが、100行以内に入るように調整しましょう。

Headタグの中身を調整する方法

Headタグの中には色々とページを表示するために必要なものが書かれているので、むやみ行を削除すると表示がブッ壊れてしまいます。
ですので、必ずバックアップを取ってから調整をしていくようにしてください。

たとえば、以下のようなものが省略できます。

  • JavaScript
  • インラインStyle
  • 解析用のタグ

まず、JavaScriptについては削除してしまうと動きのあるコンテンツが動かなくなってしまったり、表示されていたものが消えてしまったりと、何かと不都合が生じることがあります。
ですが、後から読み込んでも大丈夫なJavaScriptも多くありますので、1つずつHeadタグからfooterタグに移動させて試してみましょう。
footerタグでも動作に問題がなければ、そのほうがBodyタグを早く読み込めるのでSEO効果は高まります。

インラインStyleについては、昨今のSEOでは「CSSに書くほどの内容ではない場合はインラインStyleとして書くべき」とGoogleも言ってるので、無理に省略させる必要はありません。
私も、少し前まではどうしてもBodyタグを早く読み込ませたいがゆえに、インラインStyleを一切出力せずにすべて外部CSSにまとめていました。
これについては、あなたの考え方にお任せしますね。

解析用タグについては、例えばヒートマップとかアナリティクスのコードですね。
他にも色々と解析用のタグを入れている人は、その分だけソースが汚れてしまいます。
ですので、全ての解析用タグを一元管理するためにGoogleタグマネージャーを使うことをお勧めします。
タグマネージャーのコード1つで済むので、Bodyタグまでの距離がグッと近くなります。

いっそ、ソースを軽くしてしまえ!

上記までのやり方だけでも十分にBodyタグの読み込みが速くなりますが、更に追求するならソース自体を縮小化してしまうと良いです。

当ブログでもHTMLソースを縮小してGoogleクローラーにBodyタグを素早く読み込んでもらえるようにしています。

bodytag-gyou5

Bodyタグが、5行目!

Googleクローラーはロボットですから、たとえ100行目にBodyタグがあっても、瞬時に全ソースを読み終えるでしょう。
しかし、それでもBodyタグの開始行が上にあったほうがコンテンツをしっかりと読んでもらえます。

併せて、SytleSheet(CSS)とJavaScriptも縮小化しておくと良いでしょう。

まとめ

いかがでしたでしょうか?
あなたも自分が管理しているサイトのソースを見て、Bodyタグの開始行を確認してみましょう。
もし100行以上先にBodyタグがある場合は、ここを修正するだけでもSEO効果を期待できますよ。是非、試してみてくださいね!