第4回 自動車業界のAjaxを活用したキャンペーンを目撃せよ
株式会社ピーデー川俣 晶
2006/1/24
 |
そのほかのみどころ |
Ajaxとそれに関連する話題を紹介します。
バーグラフがぐんぐん伸びるWeb投票
Ajaxによる投票システムです。投票すると結果がリアルタイムに表示されます。また、なかなかきれいなビジュアル効果も付いています。スクロールバーにマウスポインタを置くだけでスクロールしたり、棒グラフもゆっくりと伸びていくアニメーション付きで表示されます。単に選択して投票するだけであれば、投票システムというのは、技術的にさほど難しいものではありません。しかし、このようなビジュアル効果を付けて、皆で共有すると楽しいツールになるといえます。
AJAXデータのやりとりが分かるGIFインジケータ
XMLHttpRequestオブジェクトで通信が行われていても、Webブラウザのローディングアイコンは動作しません。それにより、いま通信が行われているのかどうか、利用者が判断できないという問題が発生します。つまり、通信を行うボタンをクリックした後、まだ新しいデータが届いていないため更新されていないのか、それともたまたま新しいデータに変化がなく、表示が変わっていないだけなのか、区別ができません。そこで、通信中は、それを示すインジケータを表示すると良いとされています。ここでは、それに使用するのに適したパブリックドメイン（著作権が放棄されている）のアニメーションGIFファイルがいくつか公開されています。技術には自信があるが、デザインはあまり得意ではない読者は、こういうファイルを活用してAjaxアプリケーションを書いてみるのも1つの手でしょう。
さて、ここでこのページを紹介したのは、こういう小さなところから工夫を積み重ねる余地があるということを示すためです。例えば、デザインに自信がある読者であれば、これよりももっと格好良く見やすいインジケータを作成し、多くの人に使ってもらうという挑戦があり得ます。まだ定番が決まっていないAjaxの世界ですから、いまならそれに挑戦することができるのです。
FlashとJavaScriptを連携されるツールキット
こういうものも存在する……ということで、軽く紹介だけしておきます。FlashとJavaScriptを連携されるツールキットです。
Ajaxのライバルと目されるFlashですが、FlashとJavaScriptは共存することもできます。Ajaxアプリケーションであっても、部分的にFlashを使うという選択もありでしょう。ベンダに対して欲しいものを唱え続けて、本当に来るかどうかも定かではない未来を待つのではなく、すでにあるものは何でも使っていますぐサービスを作り上げるのがAjax流です。たとえライバルのFlashであっても、それが使えるなら使ってしまうべきでしょう。
Firefox用のJavaScriptデバッガ
これも、このようなものが存在するという軽い紹介だけ。Firefox用のJavaScriptデバッガです。
実際にAjaxシステムを開発しているときに困るのがデバッグです。例えば、Visual Studioを使えばJavaScriptプログラムのデバッグもできますが、それはInternet Explorer上でのみ可能となります。Firefoxで遭遇したトラブルの解決には使えないかもしれません。その場合は、このようなツールを試すのもありでしょう。
さて、デバッグ環境は、Webブラウザの種類ごとに考えねばならないのが、Ajaxの悩ましいところの一つです。あらゆるWebブラウザのデバッグ環境を整えるというのは、おそらく現実的には不可能でしょう。これについては、すべてのWebブラウザで正常に動作させようという考えそのものが間違いではないかと筆者は考えます。それは、あまりにハードルが高過ぎる要求です。いくつのWebブラウザをサポートするかは開発者の判断次第で変わると思うので基準はありません。しかし、マイナーなWebブラウザはサポート対象外になることが多くなるだろう……ということは容易に予測できます。つまり、AjaxはあらゆるWebブラウザの平等は保証せず、むしろWebブラウザの淘汰を推し進めるような気がします。現時点で、Internet ExplorerとFirefoxの地位は安泰と思いますが、他のWebブラウザはこれからが正念場ではないかと思います。
ちなみに、このような淘汰はソフトウェアが普及するプロセスで必然的に発生する自然な流れです。さまざまな理由から、大多数のユーザーが利用するソフトウェアの種類は少数に収斂（しゅうれん）します。そして、それらのソフトウェアが取りこぼすニーズが常に存在し、それらを積極的にサポートし続ける限り、マイナーなソフトウェアが滅びることはありません。
|
prototype.js 1.4.0を読む |
prototype.jsはSam Stephensonさんによって書かれたJavaScriptのライブラリです。強力な機能を多数含み、Ajaxアプリケーションの開発の力になってくれるものです。
しかし、ここでこれを取り上げたのは、prototype.jsを紹介するためではなく、それのソースコードを読むということが、よりディープなJavaScript理解への一つの入り口になり得るということを示すためです。残念ながら、筆者も上記の文書を読んで、「分かった」と明快に断言する段階には達していません。しかし、そこに素晴らしいソースコードがあり、それを解釈した文章があるという事実は、そこに挑戦すべき目標があることを明快に示しています。そして、JavaScriptとは素晴らしいプログラム言語であり、挑戦するに値すると筆者は思います。
しかし、なぜソースコードを読むのでしょうか？ よくあるやりとりですが。「プログラムがうまくなるにはどうすれば良いですか？」「ソースを読め！」
|
終わりに |
今回は新しい話題も、古い話題も取り混ぜてお送りしました。しかし、Ajaxへの注目度が高まっているいま、新しく興味を持った読者から見て、新しい話題も古い話題も同様に新鮮に感じられると思います。
そして、Ajaxの常識はまだ固まっていません。Ajaxを知り尽くした人であっても、まだまだ新鮮な何かが飛び出してくる可能性は否定できません。まだまだAjaxをウオッチすることは、ドキドキするようなすてきな体験であり続けることでしょう！
| 2/2 |
前のページへ|
INDEX |
||
| 自動車業界のAjaxを活用したキャンペーンを目撃せよ | ||
| Page1＜ブラウザを疾走するAjax駆動車＞TIIDA driving in はてな（期間限定）／地図日記／Lightstreame／Qooqle | ||
 |
Page2＜そのほかのみどころ＞ dPolls.com／AJAX Activity indicators／Flash JavaScript Integration Kit／Firefox用のJavaScriptデバッガ／prototype.js 1.4.0を読む | |
 |
古くて新しいAjaxの真実を見極める 「Webインターフェイスの新しい手法」「画期的なWebアプリケーションの仕組み」であるとして開発者たちの人気を集めるAjaxとは何なのか、その真実を見極めてみよう 最終更新 2005/8/2
|
|
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 （2017/7/12）
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET／POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 （2017/7/10）
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文＆ループ脱出のbreak/スキップのcontinue【更新】 （2017/6/26）
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート （2017/6/12）
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
 |
|
|
|
|
