HTML5のウソとホントをSEO的に分析してみた。

公開日:2011/11/21

最終更新日:2024/02/20

ブログ

無料で資料をダウンロード

SEOサービスのご案内
専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。

無料ダウンロードする >>
それなりの注目を集めその機能を生かした革新的なウェブサイトも時折登場しているHTML5、とはいえ普及自体まだまだですしSEO業界からも余り活用しようという積極的な姿勢は未だ見られていません。今回はサーチエンジンランドからHTML5とSEOの関係について真剣に考えてみた記事を紹介します。時代に乗り遅れないためにも、一読して自分なりに考えてみては? — SEO Japan

シアトルで開催されたSMX Advanced 2011のパネルで、私はSchema.orgのタグに関する質問を耳にした。もう少し詳しく説明すると、グレッグ・ボーザー氏による検索エンジンが最終的に元に戻った経緯に関する発言であった。

まず、検索エンジンはメタデータを検索アルゴリズムに利用した。その後、撤去した。そして、今、検索エンジンは再びメタデータを求めているのだ。ただボーザー氏のトーンからは、Schema.orgの告知やSEO戦略としてのタグの利用に関して、同氏がどう思っているのかは伝わってこなかった。

その他のパネリストは、Schema.orgのタグがコードの膨張につながる点に関してコメントし、最終的に新しいSchema.orgの新しいタグを使ってサイト全体のコーディングをやり直す取り組みを推奨するパネリストは一人も現れなかった。そして、Schema.orgのタグをSEO戦略として利用する点に対して、経験に基づいた証拠もまた提示されなかった。

これはHTML5を巡る状況と酷似している。ここ数年に渡って、HTML5に関する記事は様々なサイトで投稿されているものの、オーガニックなトラフィックにおける、あるいはSEO全般におけるHTML5の効果に関する証拠を誰も出せずにいる。

事実、有名なSEOブログまたはライターはHTML5をあまり話題に取り上げていない。そして、取り上げている人達は皆同じことを言っている。

HTML5の長所

  • ユーザビリティおよびユーザーエクスペリエンスに幾つか改善をもたらす
  • 開発者が重要なコンテンツを分類する上で役に立つ新しいタグを幾つか持つ
  • メディアを豊富に提供するサイトの役に立つ(オーディオ & 動画)
  • フラッシュおよびシルバーライトの代わりとして適している
  • ウェブサイトのクロールおよびインデックスにおいてSEOフレドリーである
  • 多くのモバイルアプリやモバイルゲームが利用する

そして、HTML5はいつかすべてを良くする。これが結論だ。しかし、その“いつか”はまだやって来ていない。

大半のブロガー/ライターは大事な点を明記していない。現時点で、HTML5の機能とコードを完全にサポートしている人気の高いインターネットブラウザーは一つもない。ハッキリさせておくが、現在のブラウザーはHTML5を表示するものの、完全にサポートされていないHTML5の局面は多く、また、全てのインターネットブラウザと互換勢があるわけでもない。

HTML5 for SEO

グーグル & HTML5

2010年5月22日、グーグルはTVゲームのパックマンに捧げるグーグルドゥードゥルを行った。これはアニメーションのロゴであり、遊ぶことが可能であった。このロゴはHTML5で作成され、HTML5をサポートしていないブラウザのためにフラッシュの選択肢を用意していた。パックマンのグーグルドゥードゥルは、大半のネットユーザーにとって、HTML5、そして、その力に触れた初めての瞬間だったと私は確信している。

個人的には、心が躍るような気分だった。私にとっては、インターネット、ウェブサイトの閲覧、モバイルアプリおよびゲーム、そして、ウェブサイトの機能の未来に実際に触れた瞬間であった。SEOに関しては、さらに想像が膨らみ、HTML5がSEOの領域にもたらすポテンシャルを真剣に考えた。

Google HTML5 Doodle Pacman

しかし、グーグルはSEOのためにHTML5をどのように利用するのだろうか?グーグルはHTML5へ移行するウェブサイトへアドバンテージを与えるのだろうか?

2010年10月の投稿の中でバリー・シュワルツ氏は、HTML5とグーグルボットを取り上げていた。その中で、シュワルツ氏は、グーグル社員のJohnMuがグーグルが“様子を見て”、人気が出てきたらHTML5を“採用する”と示唆する、グーグルウェブマスターのヘルプのスレッドを引用していた:

通常、グーグルはウェブを出来るだけ理解するように心掛けている。しかし、HTML5のマークアップが現時点では、グーグルがコンテンツをより良く理解するための手段として用いる価値があるほど幅広く(そして、正しく)利用されているとは感じられない。HTML5の人気が上がり、グーグルがインデクッスシステムに役立つような具体的なマークアップを認識するようになったら、この傾向は変わる可能性が高い。しかし、現段階では、過去のHTMLではなくHTML5を利用することでの利点があるとは私には思えない。

このスレッドは1年以上前のものだが、HTML5を利用するウェブサイトに対してアドバンテージを与える意欲は全く伝わってこない。私のクライアントがSEOのメリットのみのためにHTML5に移行するつもりなら、私はSEOの戦略としては勧めないだろう。その他の理由でならHTML5を推奨するかもしれないが、現時点では…SEOだけのためなら認められない。

HTML5がHTML4よりも遥かに優れているなら、いつ使えばいいのだろうか?そして、HTML5はいつになったらSEO戦略の役に立つのだろうか?素晴らしい質問だ。思わず自画自賛してしまった。

SEOがHTML5から得られるメリット

HTML5がSEOにとってマイナスに働くと言う印象は拭い去っておきたい。

一部のウェブサイト – 特にフラッシュに大幅に依存しているサイト – にとって、SEOは天の恵みである。フラッシュだけで構成されているサイトを運営しているなら、HTML5に移行するメリットは確実にあるはずだ。

何と言っても、サーチボットがサイトをクロールし、コンテンツをインデックスすることが出来る点が大きい。アニメーションに埋め込まれているコンテンツの全てを検索エンジンが読むことが出来る。基本的なSEOのセオリーでは、このHTML5の特徴により、自然な検索トラフィックをもたらすウェブサイトの力に大きく影響を与えると言われている。

噂(つまりリンク)を生成する傾向がある点もHTML5を利用するメリットの一つである。月曜日、フェイスブックは待望のHTML5のiPadアプリを立ち上げた。パンドラは先日最新のミュージックプレイヤーをHTML5でローンチした。ゲームプラットフォームのジンガもモバイルブラウザで利用可能な3つの新しいHTML5のゲームをリリースしたばかりである。

HTML5のウェブサイトとして、またはHTML5の特徴を活かして再び立ち上げられるウェブサイトが後を絶たない。テクノロジーの最前線にいることはユーザーにとっては素晴らしいことだが、リンク構築、報道のきかっけ作り等も忘れるべきではない。ランド・フィッシュキン氏曰く、インバウンドのマーケティングこそ最も重要なのだ。

最後にユーザビリティの面では、HTML5は、ユーザーがウェブサイトと情報をやり取りする仕組みを変えるポテンシャルを持っている。メディアを豊富に持つウェブサイトは最も効果が期待できる。なぜなら、HTML5には、とりわけモバイルプラットフォームにおけるオーディオと動画のストリーミングを容易に行うことが可能な要素が幾つか存在するためだ。

iPhoneとiPadがいつかフラッシュをサポートしてくれると言う希望を持っている人はもういないはずだ。それでも問題ない – HTML5があるからだ。開発者達は、オーディオと動画をブラウザの互換性やプラットフォームの能力を気にすることなく埋め込むことが出来るのだ。

HTML5の新しいタグ

以下にHTML5のカンニングペーパーを掲載する。HTMLに精通しているなら、大半のタグは見たことがあるはずだ。

しかし、注目してもらいたいタグが幾つかある。HTML5のウェブサイトがSEOで成功を収める上で欠かせないと考えられるためだ:

  • <article> は独立したコンテンツの塊を指定する。articleタグのコンテンツは、内臓型である必要がある。例えば、<article>でブログのエントリや新しい記事を包むことも出来る。
  • <section> は<article>等のコンテンツの塊のサブセクションを指定する。ブログのエントリが、小見出しで複数のセクションに分けられているなら、それぞれのセクションを<section>タグで囲むことが出来る。本に章があるように、コンテンツの塊にセクションをもたらすことが出来る。/li>
  • <header>は2つの意図で用いられる可能性がある: (1) ページのヘッダーを指定する (2) 内蔵型のコンテンツの塊(<article>)のヘッダーのセクションを指定する。<header>タグは、ナビゲーション、ブランディング、またはドキュメントのヘッドラインを含む可能性がある。
  • <hgroup> は見出しのセクションを囲むために用いられる(<h1>から<h6>)。ヘッドラインとサブヘッドラインが共に上位に掲載されている記事が良い例である:
    <hgroup>
         <h1>メインのヘッドライン</h1>
         <h2>記事のタグラインまたは小見出し</h2>
    </hgroup>
  • <footer> は<header>タグに若干似ている。HTMLのドキュメント全体の<footer>または<article>のフッターを指定する。フッターナビゲーションや記事に関するメタデータ(作者、データ等)を含む可能性がある。
  • <nav> はサイトのナビゲーションを囲むために用いられる。このタグは、メインのサイトナビゲーション、前/次の記事のリンク、またはページネーション等、どこでも利用される可能性がある。
  • <aside> は親の要素に関連するコンテンツを示すが、絶対にメインのドキュメントの一部でなければいけないわけではない。つまり、<aside>はウェブサイトのサイドバーで用いることも、もしくは多くの書籍に掲載されている「知っていましたか?」のように、<article>内で特別な付記を加えるために用いられることもある。
  • <video> は動画コンテンツを指定する。動画を表示するためのブラウザ間の互換性を満たすための手段を提供する。

HTML5に関する結論

HTML5がコードの膨張を緩和すると考えているなら、その考えは正しい。しかし、HTML5とSchema.orgのタグを組み合わせると、より多くのコードがページに必要になる可能性がある。人生と同じだ。ウェブはますます拡大しており、気が遠くなるほど多くのコンテンツが存在する。

そのため、グーグルとビングが、両社の非常に洗練されたサーチボットとインデックスの保管所では、ネット上の全てのコンテンツをソートすることが出来ない可能性があるため、より多くのメタデータが必要だと判断したのなら、私達ユーザーは検索エンジンに手を貸すべきだと私は思う。そして、同時にウェブサイトをより楽しく、そして、より容易に使えるようにすることで、ビジターに対してももっと優しく接しようではないか。

多くのSEO業者は、最新のHTML5に置かれるアルゴリズムの重要性を試すため、限界を押し広げていくだろう。その後、検索エンジンはアルゴリズムを頻繁にアップデートし、SEO業者がHTML5に見出した近道と戦略に対して調整を行うだろう。

過去15年間のSEO業界そのものである。フラッシュのインデックスを話題にしなくてもよい点は異なるが。うまくいきますように。

この記事の中で述べられている意見はゲストライターの意見であり、必ずしもサーチ・エンジン・ランドを代表しているわけではない。


この記事は、Search Engine Landに掲載された「SEO Best Practices For HTML5: Truths, Half-Truths & Outright Lies」を翻訳した内容です。

全体像を理解できる、綺麗にまとめられた記事でしたね。HTML5によってウェブページをより詳細にメタデータ化し、検索エンジンに正しく情報を伝える、という作業は今後より求められていくのかもしれません。CMSやWPを使っていればある程度自動的に対応してくれそうな分野ではありますが、作り手の労力が減るというよりは考える時間も含めて増すのは間違いなさそうです。それでトラフィックが増えてくれれば良いのでしょうけどね。。。ウェブ制作者の皆さん、御苦労さまでございます。って、対岸の火事的に見ていてはSEO業者失格です。 — SEO Japan

記事キーワード

  • Facebook
  • X
  • はてなブックマーク
  • pocket
  • LINE
  • URLをコピー
    URLをコピーしました!

編集者情報

  • X
  • Facebook

アイオイクス SEO Japan編集部

2002年設立から、20年以上に渡りSEOサービスを展開。支援会社は延べ2,000社を超える。SEO/CRO(コンバージョン最適化)を強みとするWebコンサルティング会社。日本初のSEO情報サイトであるSEO Japanを通じて、日本におけるSEOの普及に大きく貢献。

メディアTOPに戻る

RECRUIT

一緒に働く人が大事な今の時代だからこそ、実力のある会社で力をつけてほしい。
自分を成長させたい人、新しいチャレンジが好きな人は、いつでも歓迎します。