[技術解説]

HTML5のインパクト─Webアプリの表現力をネイティブアプリ並みに

インターネット/クラウドの最新潮流

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

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

 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の導入で得られるメリットは?

この記事の続きをお読みいただくには、
会員登録(無料)が必要です
関連キーワード

HTML5 / インターネット / Webブラウザ / RIA / Firefox / Mozilla / Microsoft / Apple / Publickey

関連記事

トピックス

[Sponsored]

HTML5のインパクト─Webアプリの表現力をネイティブアプリ並みにHTML5は、ブラウザがアプリケーションのプラットフォーム(動作環境)へと進化する転換点となるHTMLの最新仕様である。Web技術標準化団体であるW3Cによる正式勧告は数年先になる見込みだが、すでに多くのHTML5の機能がWebブラウザで利用可能だ。

PAGE TOP