クールなAjaxウィジェット――サイトの対話性を手軽に高める手法:1分ショートレビュー
Google MapsやGmailを使ったことのある方なら、最初はそのリッチなインタフェースに驚いたにちがいない。その裏で、Ajaxが活躍していることはよく知られている。こうした斬新なインタフェースを実現してくれる、クールなAjaxウィジェットを紹介しよう。
ここで紹介する記事は、developerWorksの「AjaxとXML:5つのクールなAjaxウィジェット」です。
Ajax(Asynchronous JavaScript+XML)は、従来、エンジニアに敬遠されてきたJavaScriptがXMLと組み合わさることで復権した技術。ユーザーが画面を操作するバックグラウンドでサーバと非同期に通信するため、一画面ごとのリフレッシュが不要で、スムーズな操作性を実現している。ブラウザながらユーザーエクスペリエンスを大きく向上させ、Web2.0を支える技術として注目を浴びている。JavaScriptについては、以前、こちらの記事でも紹介している。
Web 2.0の流行によってユーザーエクスペリエンスが新たな脚光を浴びる中、Ajaxを使用してサイトの対話性を強化するウィジェットが登場している。簡単にデプロイできるわりには、非常に斬新なインタフェースを提供してくれるものばかりだ。
インターネット上でウィジェットを検索すれば、WYSIWYGエディタやプログレスバー、タブ付きダイアログボックス、時計、日付選択機能、RSSリーダーなどを数多く見つけることができる。独自にDHTMLやFlashコントロールを作成する前に、既存のものが利用できないかを調べることは絶対に必要だ。
本記事では、サイトの対話性を強化する以下の5つのウィジェットをそのコードも交えて紹介している。
- SWF/Chartsウィジェット:Adobe Flashベースのコントロール。グラフ作成用のデータとスタイル設定オプションをサーバ上のXMLから設定できる
- SWF/Gauge ウィジェット:サーバ上のXMLを使用してゲージを表示するコントロール。このゲージは、飛行機や車の計器のようにカスタマイズできる
- インプレース編集:インプレース編集が可能なテキストボックスのコントロール。ユーザーに情報を直感的かつ対話式の手軽な方法で提供する
- DHTMLウインドウ:モードレスなフローティングウインドウをページコンテンツの上に重ねて配置するメカニズムを提供する
- カルーセルウィジェット:回転式の画像ビューアー。それぞれ小さなグラフィックで表現された項目のリストを、AppleのiTunesインタフェースのようにスクロールできる
中でも特にお勧めしたいのは、カルーセルウィジェットだ。このウィジェットは、一定のスペースに複数の画像を表示でき、矢印を押すだけで左右に画像をシフトし狭い画面を有効に使うことができる。AppleのiTunesやオンライン写真アルバムサービスのFlickrでも多用され、ユーザーエクスペリエンスの向上に一役買っている。これを画像のコントロールに使えば、あなたのサイトを見違えるようにしてくれるにちがいない。
この記事で紹介しているのは、商用やオープンソースのものを含め、インターネット上で入手可能なウィジェットとツールのほんの一部だ。あなたも、この記事を手がかりに、ウィジェットを探す旅に出てみてはいかがだろう。きっと掘り出しものがあるに違いないのだから。
関連記事
- developersLife〜開発者という生き方
- もうスクリプト言語しか知らない小僧とは言わせない――JavaScriptを知る
「低級言語を扱う小僧め」――バイナリアンたちにこう笑われても涼しい顔でいられるよう、JavaScriptが持つすばらしい言語機能を3つほど紹介しよう。 - Webアプリケーションの開発手法で「早くてキレイ」はRuby on Railsか
「美しいが作るのに時間の掛かる」「汚いが早く作ることができる」――Webアプリケーションの開発手法としてあなたが選択したいのはどちらか? 答えはどちらでもない。Ruby on Railsはある考えに沿って進める限りにおいて「早くて美しい」開発手法を提供してくれるのだから。
関連リンク
Copyright © ITmedia, Inc. All Rights Reserved.