SEOの内部最適化とHTML5

2012/1/23 - 内部対策（ HTMLマークアップのヒント）

SEOにおける内部最適化は、HTMLのタグをコンテンツの意味に沿って「適切にマークアップする」事が大切だと思っています。
もちろん「それだけで」順位が上昇するという効果は無いですが、本質的なSEOから考えれば「適切なマークアップ」は重要なはずです。

HTML5ではHTML4.01やXHTMLよりセマンティックなマークアップが出来るようになっているので、これから検索エンジンにより制作者の意図を伝えるためにも、「新しく追加された要素」や「定義が変わったタグ」などは、きちんとその意味や使い方も押さえておいたほうが良いのではないかなと思います。

自分自身の備忘も兼ねて、ざっくりと今知っているHTML5のタグの中で、いまもよく利用されている要素とHTML5で変わった「要素の意味」についてまとめてみようと思います。

役割が変わる・意味の付与された要素

<strong>
HTML4では強調を表す要素でしたが、HTML5では「重要性」という意味が付与されました。
たとえば「SEOにおいて良質なコンテンツを追加することは重要です」という文章全体を、<strong>でマークアップする事は不自然ではなくなります。
<em>も「強調」という意味でしたが、こちらはそのまま「強調」を表す要素です。
使い分けが難しそうですね。

<b>
HTML4では単に太字にするための要素でしたが、HTML5からは「他の箇所と区別したい時」に使う要素として、意味が付与されています。
<strong>や<em>など、他の要素でのマークアップが該当しない場合に使用する要素になりましたが、<strong>などと、どのように使い分けるのが適切なのか、これも難しい所です。

<a>
リンクには変わりはないのですが、HTML5からブロック要素を含むことが出来るようになりました。
つまり<div>や<p>の外側に<a>を使っても良いと言うことになり、文章全体をリンクすると言うことも、「HTML5の仕様上は」間違いではなくなりました。

セクションを表すための要素

文節（コンテンツの塊）を表すセクションを表すための要素がHTML5から追加されています。section、article、navなどの要素は、その名前から役割を想像するのが容易ですので難しくなさそうですが、hgroupという要素にはちょっと気をつけたほうが良さそうです。

<hgroup>
HTMLを知っている方であれば、見出しのグループということがなんとなく分かると思います。このhgroup要素の中には見出し要素が入ります。
HTML4までは<h1>の直後に<h2>があるのは「不自然では？」と思っていたのですが、HTML5ではそういったマークアップも「見出しとサブタイトル」という感じで、不自然なマークアップではなくなります。

<hgroup>
<h1>ここに見出しが入ります</h1>
<h2>ここにはサブタイトルが入ります</h2>
</hgroup>

ブログの基本テンプレートなどでは、このようなマークアップが一般的になるかもしれません。

HTML5はまだW3Cの勧告は受けていませんが、今後クロスプラットフォーム技術としてあらゆるデバイスに広がりを見せていく可能性があります。
最初に書きましたが、HTML5で書けば上位に表示される結果が出るわけではありませんが、ページの内容を検索エンジンにページの制作者側の意図まで含めて伝えるという意味においては重要な事だと思います。

ただ「W3Cの勧告がまだ」と言うことは、これから仕様が変わる可能性も（少ないとは思いますが）あると言うことですので注意してください。

【2012.8.5追記】
ウェブサイトをリニューアルするのだけれど「HTML4」と「HTML5」のどちらがSEOに有利なの？と言う趣旨の質問を受けることがあります。
答えは「別にどっちでも良いんじゃないの」です。

技術的にどちらが良いとかあると仮定して考えて欲しいのですが、
「中身はそれほどでもないが、最新のHTML5で書かれたページ」が
「中身は濃いがHTML4で書かれているページ」よりも、
検索結果で上位表示させる事はGoogleの目指すべき方向でしょうか？

その技術ごとの特性を知り、よりその技術の中での最適化とはどういう事なのか？という事は知識として持っていても良いですが。