HTMLの文書構造の基本を守る(SEO内部対策1) - 第11回ヘビーメタルSEO

こんにちは、メディア事業部ウェブディレクターのコネル飯塚です。

第11回となる、この「ヘビーメタルSEO」ですが、前回の「SEOの内部対策と外部対策について」で、内部対策とはサイトを論理的な構造にすることで、テーマ性や重要なキーワードを検索エンジンに適切に認識してもらうこと、外部対策とは評価が高く、テーマ・専門性など関連性の高い外部サイトから多くの被リンクを集めること、そして内部対策でチェックすべきポイントと外部対策でSEO効果の高い被リンクについて学びました。

具体的には、SEO内部対策でチェックすべきポイントがたくさんあるのですが、「サイトを論理的な構造にする」とはいったいどうゆうことなのでしょう？？

私にはサイトが論理的な構造という絵が想像できないのです。。

画像を見ての通り、この人は絶対に論理的ではないでしょうし、論理的思考という言葉が似合わないにもほどがありますね！

そう、2回目ですけど、こんにちは、私です。

論理的とは程遠いですが、対義語である直感的でもなさそうに見えますね。。

ということで、今回から複数回に渡って、SEOの内部対策として論理的な構造を目指すべく「ヘビーメタルSEO」ようすけべー師匠に「論理的ロジカルシンキングな考え方！」が出来るように教わっていこうと思います。

HTMLの文書構造の基本を理解する

「ようすけべー師匠！それでは今回もよろしくお願いいたします。」

「SEO内部対策をするためには、HTMLの構造を最適化する必要がある。論理的なHTMLの文書構造を意識して作るための、基本的な知識と考え方について説明していこう！」

「いまのところ論理的な構造と言われましてもまったく想像できない状態ですが、大丈夫でしょうか！？」

「そんなオマエでも大丈夫なのDEATH!!
ヘビーメタルSEOで、これから複数回に分けて内部対策について学習していこう\m/」

「ようすけべー師匠！ヘビーメタルSEOについていきます\m/」

HTMLのソースコードについて

「世の中のほとんどのWEBページはHTMLで作られていると言っても過言ではない。もちろん見た目の装飾はCSS（スタイルシート）で、裏ではPHPなどで動いている場合も多いだろう。
私たちがパソコンやスマートフォンでWEBサイトを見ることができるのは、HTMLやCSSを読み取ったコンピューターが、文書の構造を指示された通リ、ブラウザにデータを出力するからだ！
検索エンジンは、このブラウザ上で出力されるHTMLのソースコードを、定期的にクローラーで取得しているのDEATH!!」

「HTMLのソースコードを見て、検索エンジンは判断しているのですね！」

「そうだ！HTMLを最適化することがSEO上有利に働くといわれているため、内部対策を行う上で避けては通れないのDEATH!!」

「では、キレイにまとまったソースコードでWEBページを作らなければいけませんね！？」

「しかし、キレイにまとまったソースコードだからと言って、検索エンジンから評価され、検索結果の上位に表示されるという訳ではないのDEATH!!」

「違うんですか！？」

「Google自体が認めていることだが、割合は違えどほとんどのWEBページは、どこか間違ったコードや構造でも成り立っている！極端に間違っているコードは別として、検索エンジンやブラウザはそういったことに慣れているため、うまく対応している部分も少なからずあるようだ！
しかしながら、なにか問題を発見したり、修正するために、そして多くのブラウザで正確に表示されたり、検索エンジンから適切にインデックスしてもらうためにも、キレイで正確なHTMLコードを使うことは大切なのDEATH!!」

「気にしすぎるとキリが無いけど、HTMLの基本的な知識を身につけることで、ソースコードの無駄な記述や間違ったタグの使用を失くし、検索エンジンからのマイナスポイントを防げるということになりますね！」

ミスやエラーをチェックするバリデーションツールについて

「SEOを意識したコーディングをする時に気をつけるべきポイントとして、ミスの少ないコーディングを心がけることはもちろんだが、もしミスやエラーがあったとしたら、それを出来るだけ早く見つけ、修正することが大切だ！」

「気づかなかったり、原因が分からない場合もありますよね！？」

「そんなミスやエラーをチェックしたい時は、バリデーションと言われる便利なツールがある。
規定された文法や要求された仕様に沿って、正しく記述されているかどうかを検証してくれるのDEATH!!」

「夢のようなツールですね！！」

「しかし、様々なバリデーションがあるが、それが完全に正解というわけでもない！ツールで高得点または満点を取ったとしても、検索エンジンが同じように高く評価するわけではないのDEATH!!」

「こちらも出来るだけマイナスポイントを防ごうという考え方ですね！」

セマンティックWEBという考え方について

「HTMLが表示するWEBページやその中に記述されている内容について、単なるデータの集合体から知識のデータベースに進化させようという試みがある。
WEBサイトがどんな構造で、中の要素が何を意味するかを表す情報を、コンピュータが効率よく情報を収集して、より解釈できるようにする構想をセマンティックWEBと呼ぶのDEATH!!」

「セマンティック！！カッケー！！進化していますね！」

「まだ限定的ではあるが、個々の情報について記述する際に、それが何を意味するのかを表すデータ（構造化データ）を付与することで、特定の種類の情報を収集して活用したり、より複雑で精度の高い検索が可能になるのDEATH!!」

「人間にしか分からない部分もある要素の意味を、検索エンジンに文書のデータからより詳しい個々の意味として高度に伝えることができるわけですね！」

「まだまだこれからだが、クローラーが見やすい、理解しやすい構文を意識することだ！コーディングはレイアウトすることにプラスして、意味を持たせるということ。
セマンティックWEBという考え方で、構造化データを利用する重要性は、いっそう高まるはずDEATH!!」

構造化データのマークアップについて

「現在のところ構造化データとしてリッチスニペットの表示が限定的な範囲ではあるが確認されている。
検索結果に通常表示されるページタイトル + URL + 説明文の構成に加えて、リッチスニペットでは、商品レビューや画像、人物、会社や組織、レシピ、イベントや音楽、パンくずリストなどの付加情報を表示させることが出来るのDEATH!!」

「では今すぐ取り入れた方がSEO的に良いですね！？」

「リッチスニペットの表示により検索結果画面における占有率や注目度が高まるため、クリック率の向上は期待できるが、すべての検索キーワードに対して、リッチスニペットが表示されるとは限らない。
そして、構造化データとして適切にマークアップしたとしても、検索順位の向上に有利に働くとは言えない。」

「じゃあ、検索順位が上がらないならやる必要ないですね！」

「しかし、ユーザーにとって便利なものについて、今後は対応範囲が広がっていくことが予想される！まずは下記の記事を参考に「パンくずリスト」の構造化データのマークアップから利用してみると良いのDEATH!!」

パンくずリストの構造化マークアップの方法

まとめ

「最後のまとめとして、HTMLのソースコードについてミスやエラーを起こさないようコーディング時は注意し、必要に応じてバリデーションツールを使うことで素早くミスやエラーを発見・修正するようにしよう！
そしてセマンティックWEBという考え方や構造化データのマークアップについての理解を深めることで、SEOの内部対策として、『論理的』な文書構造を意識してHTMLを最適化していこう\m/」

「はい！！完全に理解できました！！本日でSEOの内部対策について『論理的』に考えることができるようになりましたっ！！！」