[技術解説]

2010年10月5日(火)新野 淳一（Publickey）

リスト

　HTML5は、ブラウザがアプリケーションのプラットフォーム（動作環境）へと進化する転換点となるHTMLの最新仕様である。Web技術標準化団体であるW3C（World Wide Web Consortium）による正式勧告は数年先になる見込みだが、すでに多くのHTML5の機能がWebブラウザで利用可能だ。

　実際、主要ブラウザベンダーはHTML5対応に力を入れている。AppleやGoogle、Mozilla、Opera Softwareはすでに、HTML5をサポート済み。最大手であるマイクロソフトも、次期バージョン「Internet Explorer 9」でHTML5をサポートする。

　HTML5というと、自由なグラフィック描画を可能にする「Canvasタグ」や、動画・音声の再生をWebページに埋め込む「Video/Audioタグ」に注目が集まりがちだ。だが、HTML5はそれ以外にも、Webアプリケーションにネイティブアプリケーション（クライアントPCにインストールして使用するアプリケーション）並みの表現力や操作性を与える機能を追加している。

　ここでは、そのなかから企業ユーザーへのインパクトが特に大きいと思われる3つの機能を紹介したい。Webブラウザ上でローカルなデータベースを提供する「Web Storage」、ユーザーの入力作業を支援する「Form」、JavaScriptでローカルファイルにアクセスできる「File API」である。

ブラウザ内にローカルDB、オフライン作業を可能に

　Web Storageは、ブラウザ内にデータベースを保持する機能である。具体的には、「ネットに接続していない状況で、事前にPC内のローカルデータベースにロードしておいた顧客データを参照する」「ネットに接続していないPCに入力したデータを、接続された時点でサーバー上のデータと同期させる」といったことを実現できる。

　ユーザー側の入力作業を支援するForm機能も大幅に拡張した。ブラウザからの入力フォームを作成する「inputタグ」に、「email」や「url」「date」など13の属性を追加。入力欄ごとに、入力フォーマットを指定できるようにした。

　これにより、正しいフォーマットで入力されたかをブラウザ側でチェックできる。例えば、email属性を付与した入力欄にメールアドレス以外のデータを入力するとエラーを表示する、といった具合だ。新たな13の属性にはこのほか、カレンダーやスライドバーを使った直感的な入力を実現する「date」「range」などが含まれる。

　ブラウザからJavaScriptでローカルファイルにアクセスできるAPIも策定された。これがFile APIである。FIle APIを使うと、ローカルにある画像ファイルを読み込んでブラウザ上で表示したり、同じくHTML5で策定されたドラッグ＆ドロップAPIと組み合わせて、ブラウザへファイルをドラッグ＆ドロップで読み込ませることもできる。

●Next：HTML5の導入で得られるメリットは？