マークアップ言語HTML5の特徴

Web業界においてスマートフォン対応が進む中、標準化作業が進められている"HTML5"。技術者ではない方でもその特徴を理解しやすいようにご紹介します。

株式会社マイクロウェーブ 2011/8/17 16:44 モバイル | コラム

※この記事は読者によって投稿されたユーザー投稿です：

編集部の見解や意向と異なる内容の場合があります
編集部は内容について正確性を保証できません
画像が表示されない場合、編集部では対応できません
内容の追加・修正も編集部では対応できません

HTML言語の最新バージョンとして、Web標準化団体であるW3Cによって現在標準化作業が進められている"HTML5"。Web業界においてスマートフォン対応が進む中、これに合わせて"HTML5"という言葉もよく耳にするようになってきました。本コラムではこのHTML5について、技術者ではない方でもその特徴を理解しやすいようにご紹介します。

HTMLの概要・歴史

まず、HTMLについて簡単な復習になりますが、正式名称はHyperText Markup Language（ハイパーテキストマークアップランゲージ）。Web上のドキュメントを記述するためのマークアップ言語になります。1996年からはW3Cによって商用ソフトウェア・ベンダーからの支援も受け、HTMLの仕様が標準化され、2000年からは国際標準となりました（ISO/IEC 15445:2000）。その後、随時改良が行われ、現在W3Cから公開された最新のHTML仕様はHTML 4.01です。"HTML5"は草案段階になり、現在も開発中になります（2011年7月20日現在）。草案段階にもかかわらず、世界中から注目を浴びている"HTML5"ですが、そのきっかけは2009年5月に米Google社がサンフランシスコで開催したイベント「Google I/O 2009」にて、Google社が今後、HTML5が技術的な標準言語となると発表したことと言われています。また、もうひとつ注目される理由としてiPhoneとiPadが関連しています。Webサイトのスマートフォン対応が業界全体の大きな課題として進んでいますが、その障壁としてiPhoneとiPadでは、Apple社の方針によりFlashを利用することができないという問題があります。そしてこの問題を解決する一つの方法としてHTML5の利用が指示されています。

なぜGoogleがHTML5を支持しているのか━━━。
なぜスマートフォンの制作言語として支持されているのか━━━。

ここに"HTML5"の特徴があります。

HTML5の特徴【1】　マークアップの記述が簡略化された

要素の定義の見直しが行われ、要素に対しての必要な属性などが省略されました。これにより、見た目にも記述がスッキリ見れるようになります。また、HTML5には「ここはこんなコンテンツです」ということを明示的に表すためのタグが追加されたことから、コンテンツの中身や種類が分かりやすくなりました。Google社がHTML5を支持する理由の一つにこの“HTML5”の特徴があると推測されます。情報がわかりやすくなったことから、検索結果にすばやく正確な情報を表示することが可能になります。また、関連する広告を出す際も、より関連するところに出すことが可能になり、広告収入の大幅な伸びが期待できるようになります。また、「ここはこんな機能です」ということを表すタグも見直されたことによって、フォームの機能も拡張されました。例えばメールアドレス（type="email"）と指定するだけで、そこにメールアドレスとして不適切な値を入力して次へ進もうとすると、HTML5 Formsをサポートしたブラウザであればエラーが表示され、次へ進めなくなります。同様に電話番号（type="tel"）と指定すると、スマートフォンでアクセスした場合、入力時に電話番号入力用のパネルが表示され、利用者の操作性を向上させることができます。
イギリスの自動販売機会社KLIXのお問い合わせフォームはHTML5で新たに導入された入力フォームコントロールを導入。HTMLのタグのみで電話番号やメールアドレスのエラー判定を行います。また、iPhoneで電話番号を入力しようとすると電話番号入力用のパネルが表示されます。
URL： http://www.klix.co.uk/

HTML5の特徴【2】　プラグインなしで動画や音声等のRIAの利用が可能になった

これまでRIA（リッチ・インターネット・アプリケーション）を再生、実行するには、Adobe社が提供するFlashや、Microsoft社が提供するSilverlightといったプラグインを利用する必要がありました。こういった機能はWeb標準として規定されていないこともあり、ブラウザにRIAに必要な機能が実装されていない、実装されていたとしてもブラウザによって使い方が違う、という課題がありました。そのため、プラグインはWebにとって必要不可欠になっていました。ところが、HTML5にはさまざまなAPIが規定され、この状況が大きく変わってきました。これまでプラグインでしか再生、実行できなかったコンテンツが、プラグインなしで再生、実行されるようになります。このことからApple社の方針によりFlashを利用することができないiPhoneとiPad用としてHTML5が指示されるようになりました。

Internet Explorerの9の発表に伴い、Microsoftが新しいブラウザの機能を披露するために制作したゲームを紹介します。Flashを使わずに、html5とjavascriptを活用して制作しています。このためhtml5に対応したブラウザの場合、新たにプラグインを追加しなくても動作することができます。
URL： http://agent8ball.com/

Radio Deejay Visual Playerというイタリアのラジオ局のサイトです。ラジオ番組収録風景の写真や動画、登場したミュージシャンの楽曲の音源（と歌詞）をFlashを使わずに配信しています。
URL： http://www.deejay.it/D5/contest/index-eng.html
こちらの動画もFlashは使用せず、MP4とOGVの両形式に対応しています。

利用する上での懸念点

ここまで特徴を紹介した"HTML5"ですが、現時点では利用する上で懸念されることがあります。まず、HTML5はまだ草案になり、正式に仕様がFIXしてリリースされたものではないということです。仕様としてFIXされていないので、今後仕様が変わる可能性があり得ます。そしてHTML5はブラウザごとに実装状況が異なっており、IE6やIE7ではHTML5がほぼ対応していない状況になり、同じブラウザでも、バージョンごとに対応の有無が存在します。現状スマートフォン系のブラウザはWebKitを採用しており、WebKit自体がHTML5をサポートしているのでiPhoneやiPadなどのiOSだけではなく、Androidにも対応しています。これらのことから、スマートフォン以外のPCサイトやモバイルサイトに導入する場合は状況や仕様をよく理解した上でPC、モバイル、スマフォ共通でHTML5を利用するか、PC、モバイルとスマフォの制作言語を分けて利用するのかを慎重に検討する必要があります。