HTML 5はユーザビリティにもSEOにも効く新次元の規格

HTML 5

ユーザビリティにもSEOにも効く新次元の規格

ネット業界で毎日のように登場する新語には、重要なトレンドを生み出すものや、単なるから騒ぎで消えていくものがある。

ここでは、一歩先行くウェブ担当者ならぜひとも覚えておきたい注目のキーワードを紹介しよう。

小川 有希大（株式会社 ビジネス・アーキテクツ）

出自からわかるHTML 5の原点

図1　HTML 5の前身である「ウェブアプリケーション1.0」の策定を開始し、現在もW3Cと協調してHTML 5の策定を続けているWHATWG（ウェブハイパーテキストアプリケーション技術ワーキンググループ）。

HTML 5は、HTML、XHTMLと、それらをスクリプトなどで扱うための仕組みの定義を総合的に扱う、新しいHTML仕様だ。

HTML 5を正しく理解する大きなポイントとして、現在はウェブ標準の仕様を多く定めているW3C（ワールドワイドウェブコンソーシアム）で策定作業が進められているが、以前はWHATWGという団体によって「ウェブアプリケーション1.0（Web Applications 1.0）」という名前の仕様として開発が進められていた点がある。内容にふれる前に、まずはその根本の思想にもかかわるWHATWGという団体について軽くふれておきたい。

WHATWGの正式名称は「ウェブハイパーテキストアプリケーション技術ワーキンググループ（Web Hypertext Application Technology Working Group）」。ウェブブラウザの開発元であるApple、Mozilla、Operaを中心にして2004年に結成されたワーキンググループだ。誰でも参加でき、その他の参加メンバーには、ウェブサイトやアプリケーションの開発に携わる技術者や、関連技術の開発に興味を持つ個人も含まれる。

WHATWGの現在の主な活動として、HTML 5のほかに、「ウェブフォーム2.0（Web Forms 2.0）」「ウェブコントロール1.0（Web Controls 1.0）」といった仕様の開発が挙げられる。ウェブフォーム2.0は、HTML 4.01で定義されているフォーム関連の仕様をベースにしながら、必須入力や英数字のみなどの入力形式の限定、多様な入力タイプの追加など、フォームに関する機能や定義を拡張する仕様だ。ウェブコントロール1.0はウィジェットをスクリプトやCSSによって作成できるようにするものだが、現在策定中の他の技術仕様の影響を受ける可能性があるとして、現在もまだ草案を公開するまでには至っていない。

団体名や活動にも表されているように、この団体の目的の1つはウェブアプリケーションに関する技術展開である。より高機能なウェブアプリケーションをより簡単に構築できるよう、仕様の開発を行い、それを提供する。

より良いウェブアプリケーションのために

HTML 5がこれまでのHTML仕様と一番違うところは、文書構造の定義だけでなく、ウェブアプリケーションの操作部品や機能を提供する共通の言語として強く意識されていることだろう。これにはWHATWGの思想や昨今のウェブの使われ方が多分に影響している。

近年、グーグルのGMailや新スポンサードサーチの管理画面など、さまざまなサービスが高度なウェブアプリケーションとして提供されるようになり、より使いやすく、より特徴的な機能を求められるようになってきている。求められる処理内容も高度になり、ブラウザ上で実行されるスクリプトとサーバー側のプログラムが通信して情報をやりとりする「Ajax」と呼ばれる機能も多く使われるようになっている。

もちろん、これらのウェブアプリケーションは既存の技術の組み合わせで実現されているのだが、HTML 5では新しいタグを追加することによって、さらに豊富な表現をもったウェブアプリケーションをより簡単に構築できるようになる。たとえば、入力フォームに関しては、電話番号やメールアドレスの書式チェック、必須入力項目の指定、ホテルの予約で宿泊人数分の情報が必要であれば入力欄の増減や並べ替えも、すべてHTMLのみで簡単に実装できるようになる。このような機能以外にもさまざまな仕組みが提供されることで、ウェブアプリケーションとして実現できることや機能が豊かになり、スクリプトを使わなくてもこれらの機能を実装できるようになる。

また、スクリプトやプログラムで利用できる機能についても強化されている。新たなHTML定義に対応するのはもちろん、Cookieに代わるデータ保存機能や、Ajaxで利用されるようなページ全体を改めて読み込み直すことなしにサーバーと通信を行う機能を含め、いくつかの機能が追加される予定だ。特に追加される通信機能にはP2P接続を行う仕組みもあり、新たなサービスにつながる可能性がおおいにある。

より明確になる文書構造

HTML 5では、ウェブアプリケーションに関する内容だけでなく、文書構造に関するタグも見直しと追加が行われ、従来のHTML仕様に比べ詳細な意味定義が行えるものに変更されている。

追加されるタグで文書構造について特に効果を期待できそうなのは、章ごとの区切りを行えるsectionタグ、ナビゲーションを明示するnavタグ、主題となる記事を表すarticleタグ、主題とは別の関連情報をまとめるasideタグといった、セクション定義に関するものだ。従来のHTML仕様では、ナビゲーションや記事の区別、見出しとその本文の関連性を文書構造的に明確に示すことができず、意味の不明確なdivタグによってしかグルーピングできない場合も多かった。しかし、これらのタグが追加されることで、navタグとarticleタグによってナビゲーションと記事本文は区別できるようになり、sectionタグによって見出しと本文をまとめれば、その関係は明白になる。

図3　検索エンジンにもブラウザにもメリットのある文書構造の明確化

また、テキスト以外の内容を埋め込むためのタグも種類が増えた。今までは「画像」と「それ以外」という区別しかできなかった。画像についてはimgタグ、それ以外の音声・ビデオやFlashのようなインタラクティブなコンテンツについては主にobjectタグを使用することになっていたのだ。しかし、HTML 5では映像を埋め込むためのvideoタグ、音声を再生するためのaudioタグが追加されたことにより、動画と音声についても区別できるようになる。たとえば音声を再生できない環境ではaudioタグを無視する選択も行えるし、動画に関する情報を集めたい場合にはvideoタグを手がかりにすることもできる。さらに画像や埋め込まれたコンテンツとそのタイトル、キャプションなども、新たに追加されたfigureタグでまとめることによって関連性が明らかになる。

HTML 5は他の技術とどう違う？

HTML 5は複数の分野にまたがって仕様を定めるものであるため、用途や目的が重複する他の仕様がいくつも存在する。それらとの違いや関係性を述べておく。

XHTML 2.0

HTML／XHTMLの新しい仕様としては、現在策定中のXHTML 2.0がある。（X）HTMLの新たな仕様として、お互いに比較の対象としてあげられることが多いこの2つの違いについて述べておこう。

XHTML 2.0はXMLベースのマークアップ言語、XHTMLの次期バージョンである。すでに勧告済みの（仕様として決まった）XHTML 1.1では、XMLベースになったことを除いてHTML 4.01との大きな違いはなく、HTMLからXHTMLへの移行ステップのようなものだった。XHTML 2.0ではさらに次のステップへと進み、本格的に仕様の改変が行われている。意味づけを行うためのタグを充実させ、太字にするためのbタグや斜体にするためのiタグなど、視覚的なスタイルを変更するだけのタグは一切といっていいほど削除した。また、規定されたタグだけで補いきれない語彙については、タグごとにその役割や意味を記述できる属性を追加することで補強している。このようにXHTML 2.0は、意味づけを中心にした強化とブラッシュアップが行われている。

対してHTML 5は、ここまででも述べてきたとおり、意味づけのためのマークアップだけでなくウェブアプリケーションで利用される機能にまで、その範囲を広げている。コンテンツとしての情報を扱うための従来のHTML仕様とは異なり、ウェブを通じたコミュニケーションをも視野に入れた新しい仕様だといえる。

HTML 5とXHTML 2.0の内容にはそれぞれに異なる目的が特徴としてよく表れており、優劣をつけるような比較を行うことはできない。両者が勧告された後は利用目的に合わせて選択を行うべきものとなるだろう。

XUL／XAML

アプリケーションを操作するインターフェイスの部品を設計して実現する言語には、代表的なものとしてFirefoxなどで利用されているMozillaの「XUL（ズール）」と、Microsoftの「XAML（ザムル）」がある。どちらも自由にタグの定義を拡張できるXMLをベースとしており、アプリケーション構築に必要な部品などの定義を行っている。

HTML 5はブラウザで閲覧／実行するウェブアプリケーションにその範囲を限定しているが、XULやXAMLはデスクトップ上で動くような通常のアプリケーションの構築まで想定している点が異なる。HTML 5では、「デスクトップ上のアプリケーションについては対象の範囲ではない」と明言しているのだ。

HTML 5の前にそびえるいくつかの壁

HTML 5と比較されるような仕様がいくつかあることもあり、何が標準の仕様として生き残るかを賭けた「標準仕様戦争」が起こるのではないか、と心配する声もある。しばらくの間はどの技術、仕様が最適なのか考えなければいけない状況が続くかもしれないが、それは結果として多くの人が真剣にウェブについて考え、ウェブという場がより良いものになっていく、という明るい見方もできるだろう。

HTML 5は現在、策定作業がWHATWGからW3C HTML WGに引き継がれている。現在も草案の策定段階であり、その後には実装テストが控えている。これらの作業を経てW3Cから勧告されるまでには、まだ長い時間がかかることだろう。実際、WHATWGからは最終的な仕様が決まるのは2022年以降になるという見解も出ている。

また、策定作業が開始された2004年と現在の2007年の間でも、ウェブに求められるものは変化している。HTML 5で変更される内容のいくつかは、現状のウェブの使われ方や開発の仕方に合わせて考えられている部分もあるため、策定作業が長引けば、これらの変化がHTML 5の仕様にも影響を及ぼすことになるだろう。そうなれば、最終的な仕様の策定までに、さらに長い時間を要する可能性もある。

もちろん、W3Cから勧告が行われた後も、開発者がHTML 5の仕様を正しく理解し、対応したブラウザを作ってリリースし、それを多くのユーザーが使うようにならなければ、実際にウェブサイトやウェブアプリケーションにHTML 5を採用するわけにはいかないだろう。

しかしながら、W3CのメンバーにはMicrosoft、Apple、Mozilla、Operaといった主要なブラウザ開発団体がおり、HTML 5の仕様はいくつかのセクションに分かれているので段階的に仕様開発とブラウザの実装を進めることもできる。既存のブラウザで独自に実装されていたものを仕様に取り込んだものもあるし、すでに一部のブラウザに実装されている内容もある。必ずしも数十年先まで実現されないものではなさそうだ。

結論：HTML 5とは

HTML 5の策定とブラウザの実装が実現すれば、さまざまなタイプのウェブサイトに導入のメリットがある。ウェブアプリケーションでは、いくつかの機能はプログラム処理を行わなくてもHTMLだけで容易に作成できるので、開発の効率化やコスト削減も望める。通常のウェブページでHTML 5を採用した場合には、今までより意味のはっきりした文書を作成でき、検索エンジンを利用してウェブサイトを訪れるユーザーに対して、より適切なページに誘導できるだろう。

このようにHTML 5はコンテンツの提供者と開発者、そしてユーザーに対して新たな可能性を示してくれる。

さて、上司や取引先から「HTML 5ってどうなの？」と聞かれたときにはどう答えればいいのだろうか。もちろん仕様が定まるまでにHTML 5の姿が変わる可能性はあるため「現時点では」という但し書き付きだが、次のように答えるといいだろう。

ウェブアプリケーションを構築して運営するならば、HTML 5を採用すれば構築のコストが下がったり、今までできなかったことができるようになったりするでしょう。

コンテンツだけのサイトでも、検索エンジン最適化の側面からも導入する意義はあります。検索エンジンもおそらくアルゴリズムを対応させてくるでしょうから。でも、CMSのテンプレート変更で対応できるのでなければ、既存のコンテンツをHTML 5で書き直すコストはコンテンツ数に応じて高くなってしまいます。

とはいえ、実際に使えるようになるまでに少なくとも数年はかかるはずなので、ウェブマスターの立場としては、まだ当面は気にしなくていいはずです。もちろん、ウェブデザイナや開発者なら、定期的に標準化の進み具合をチェックしておくべきですが。