ワクワクするHTML5

HTML5は楽しそうです。ぜひ会得したいと思わせてくれる記事を紹介します。

すべてHTML,CSS,JavaScriptだけで実装できると思うと驚きです。

3Dオンラインゲーム

GoogleがHTML5で作成したもの。ここまで出来るのか。

3Dテト○ス

実際に遊べる3Dゲーム。

http://www.benjoffe.com/code/games/torus/

ペイントツール

画像を編集するツール。

http://muro.deviantart.com/

iPhone アプリ

iPhoneやAndroidで有名なスマートフォン、iPadで有名なタブレット型PC。

いずれもブラウザが使えるのでHTML5によるアプリが作れます。

しかもJavaScriptでタッチや加速度センサーが利用できるのです。

以下のリンクはiPhone、ipod touch、iPadなどの実機で動作確認してみてください。

ゲームライブラリ＆共有スペース

9leapというサイトでenchant.jsというライブラリが公開されている。

enchant.jsで作成したゲームは9leapのサイトに投稿できる。

投稿したゲームは共有され、誰でもプレイできる。

http://9leap.net/

開発ツール

HTML,CSS,JavaScriptがブラウザ上で編集、実行、公開できる。

ソースコードは共有できるので不明点を質問したりできます。学習環境としても優秀。

このサイトを利用してアプリ開発ができてしまう。

http://jsdo.it/

サーバーサイド for JavaScript

JavaScriptでサーバーを作成することができます。HTML5ではないけど感心したのでメモ。

node.js
node.websocket.js：HTML5のWebSocketを利用
Scrumblr：node.jsを使用したWEBアプリでメモを共有できる

http://nodejs.jp/

HTML5で世界が変わる

HTML5というか、世界は常に新しい技術革新が起こっているのです。たまたまHTML5なだけ。HTML5ですら古くなっていくでしょう。それでも今HTML5でできることを知るとどんどん妄想が膨らみワクワクします。今現在の私の妄想についてメモします。

HTML4とはちがうのだよ

セマンティクスなHTML文書を作ることでデータに正確な意味をもたせることができる

これまでネットに存在するHTML文書はほとんど単なるテキストだったのですが、それらに多くの「意味」を与えることが出来ます。たとえば新しく追加される<article>によって「本文」が、<time>タグによって「日時」が表現できるようになります。また、microdataによりHTML要素にメタ情報を付与できるようになり、新たに用意されたタグとは別に自由に意味づけできるようになります。

これによってプログラムでデータを自動的に処理しやすくなります。HTMLは単なるリンクされたテキスト情報ではなく、Webアプリなどのプログラムから利用できるデータとなってゆくでしょう。

では正確な意味づけをすることで得られるメリットは何でしょうか。考えられる例として、欲しい情報を的確に効率よく得られるようになることが上げられます。

たとえば、現在は情報がほしいときはサーチエンジンにキーワードを入力して検索結果を探し当てます。関係ない情報や関連の薄い情報が多くて惑わされたり、断片的な情報を少しずつ調べていくしかなくて手間がかかるなど、知りたい情報にたどり着くまでに苦労することが多いです。しかしこれからはセマンティクスな文書が増えることで、欲しい情報だけをかいつまんで持ってくることができるようになるでしょう。それどころかWebアプリによって将来的には自分から「探す」行為をせずとも勝手に今欲しい情報が集まってくるようになるかもしれません。

どんなデバイスであろうがHTML,CSS,JavaScriptだけでアプリケーションを作れる

これまではデバイスやOSごとに異なるプログラム言語や環境でネイティブアプリを開発していました。PCではWindows,Linux,Mac、スマートフォンではiOS,Androidなどの環境があり、それぞれの環境ごとにC言語やJavaなど異なる言語や開発環境が必要です。しかしこれからはブラウザが共通プラットフォームとなることで異なるデバイスやOSであっても同一のプログラム言語で開発できるようになるでしょう。

そのため、これまでよりは少ないスキルでアプリケーション開発が出来るようになると思います。敷居が低くなることで開発者が増え、楽しく便利なWebアプリが増え、触発されて開発者が増え……の繰り返し。こんな楽しいスパイラルが発生すれば明るい未来が待っている気がします。

双方向通信でリアルタイムに繋がれる

HTTP同期通信

これまでのネットワーク通信は、クライアントの要求があって、はじめてサーバーが返答を返すという仕組みでした。逆にサーバーからクライアントへ情報を発信するということはできません。したがってクライアントはサーバーに要求することでしか最新情報を得られません。要求は更新ボタンを押下することで行われるため、それまでは古い情報のままです。

HTTP非同期通信

そこでAjavxやCometという技術が生まれました。これはクライアントが要求を何度もサーバーへ送ることで頻繁に最新情報を得る仕組みです。更新ボタンではなくプログラムによってユーザに知らせず要求しています。たしかにリアルタイム性は向上しましたが、今度はたくさん要求することでサーバーへの負荷が大きくなってしまいました。結果、サーバーがダウンしてサービス自体が利用できなくなるという事態が起こりました。

HTTPの限界

これが今日利用しているHTTPという通信規格（プロトコル）の限界です。多くの人がリアルタイムに繋がることが難しいという大きな問題があります。それを打破するためのプロトコルが考えられました。それがHTML5のWebSocketです。

WebSocket

おさらいすると、HTTPでリアルタイムに繋がろうとした場合、サーバー自身からの発信ができないためクライアントからの要求が一方的に殺到し、結果サーバーがパンクしました。そこでHTML5のWebSocket、Server-Sent Eventsという通信規格（プロトコル）が登場しました。WebSocketはサーバーから各クライアントへ発信できます。サーバーから各クライアントへ最新情報を発信すれば、各クライアントは要求せずとも受信するだけで最新情報が入手できます。結果、サーバーへの要求が減ってサーバーダウンしなくなり、かつリアルタイムに情報を得ることが出来るのです。

クライアントにデータ保存できる

これまでのWebサイトの中にはサーバーではなくクライアントに情報を保持するものがありました。Cookieという技術で保存していましたがごくわずかなデータしか保存できないという欠点がありました。

HTML5では、Application Cache、Web Storage、Indexed Database API、File APIなどでWebから制限なくローカルへデータ保存したり、ローカルのファイルにアクセスしたりできる仕様の策定を進めています。

これによりWebアプリなのにローカル環境が操作できるアプリを作成したり、ネットワークが接続していないオフラインの状態でもWebアプリが使えたりするようになります。これはネイティブアプリとなんらかわらないでしょう。

まとめ

ここまででわかるように、HTML5は単に文書を意味づけするだけにどどまりません。これまでWebアプリでは出来なかった様々なことができるようになるものです。あるいはネイティブアプリですら難しかったことも可能にしてしまいます。それほど多様なAPIを含んだ規格がHTML5です。

あんなこといいな、できたらいいな

妄想です。きっとHTML5はこんな風に世界を変えていくでしょう。いろんな方の妄想もぜひ聞いてみたいです。

情報の方からやってくる

たとえば何気なくツイッターで「最近仕事ばかりでつまらん遊びてぇ」とつぶやいたら、検索アプリが勝手に近場のイベント情報などをＰＣやモバイルに届けてくれる。現地に言ったらおすすめのブースを地図や音声案内で知らせてくれる。

いつでもどこでも出張ガイド付きツアー

ピクニックに出かけたとき、目に映った花の名前がメガネやコンタクトに表示される。豆知識を得ながら散策を楽しむことができる。メガネなどの画像入力デバイスから画像をインプットしWeb経由でデータベースにアクセスしてメガネに表示する仕組み。

ぐうらた主婦のしっかり家事

外出の用事を終えて、ついでに買出ししようと思ってふらっと店へ入ったとき、家の冷蔵庫の中身をコンピュータが調べて足りないもの、買い足すべきものをモバイルへ知らせてくれる。品定め中にはその商品の産地やレシピの提案などが得られる。会計はモバイルで済ませ、同時に購入した品の情報から家計簿を自動でつけてくれる。

怖くなってきた

ここまで妄想しましたが、ちょっと怖くなりました。生まれたときからコンピュータから提案されるのが当たり前の世界に居ると、いつのまにかコンピュータに支配され、自分の意思を失った人間になってしまいそうです。発信力のある人間の一言で大勢の人間が利用される事態が起こりやすくなりそうです。今以上にデマやメディアに踊らされたり、おカルト教団の洗脳が氾濫したり、暴動のきっかけとなることが増加するかもしれません。

情報が多いことや人との距離を近づけることは良いことばかりじゃなさそうですね。自分の考えを持ち、情報や他者との関わり方をしっかり考えることが一層大事になるでしょう。（でもそのためにはやっぱり情報や人と関わりコミュニケーションすることが必要なのでしょうけど）少なくともすでに世界は動き出していて妄想が現実になる日も近いかも知れません。そうなるともはや無関係ではいられなくなり、否応なしにそんな世界で生きることを余儀なくされるでしょう。実際、今日では携帯電話はだれでも当たり前のようにもつようになりました。こうして以前は考えられなかったことが常識になっていくのです。