ライトボックス

ライトボックス

　ライトボックス（http://www.huddletogether.com/projects/lightbox2/）はオープンソースのJavaScriptライブラリで、Webサイトの上に重なる形式のモーダルウィンドウを簡単に作成することができます。もともとライトボックスは、ページ上にイメージギャラリーを簡単に表示するために作られました。しかし最近では、タスクを実行するためのダイアログボックスを持つ手法になりました。

　私たちのケースでは、マイリストのアイテムに結びつける写真のアップロードや、ファイル管理、例文管理などにあたります。モーダルウィンドウのメリットの1つとして、現在のページのアーキテクチャから抜け出すことができます。別の独立したインターフェースのスペースのレイヤーを提供し、一方でその下にあるスクリーンへの関連性を維持します。

　以前に、これらの種類のインタラクションはポップアップウィンドウ上で行われていました。しかしながら、近ごろのWebブラウザは、何かしらのポップアップウィンドウをブロックする機能が備わっているので、このインタラクションは、ますます扱いにくくなりました。ユーザーにそのサイトのポップアップウィンドウを手動で許可をしてもらわないといけないことが途切れないスムーズなUX（ユーザーエクスペリエンス）への妨げとなり、多くの場合は特定の機能が使えなくなることにも結びついてしまいます。

　初めて、iKnow!でライトボックスのスクリプトを取り入れた時、いくつかの制限に気がつきました。ライトボックスにイメージだけではなく、コードスニペットも投入することに関心がありました。ライトボックスにAjaxを使うことにも興味がありました。これらのニーズに対応するため、Lightdivというライトボックスの拡張を開発しました。LightdivはモーダルウィンドウにHTMLスニペットやAjaxやイメージを定着させることを可能にしました。LightdivとAjaxの使用には、メリットがあり、それをさまざまなスクリーンを通してiKnow! Webアプリケーション全域で見ることができます。

Ajaxの特徴

　読者の皆さんのほとんどは、少なくともAjaxについて聞いたことがあり、どういうものなのかおわかりでしょう。基本的には、AjaxはAsynchronous JavaScript and XMLの略で、アプリケーションが簡単にデータをサーバーへ送受信でき、ページ全体の更新を必要としないテクノロジーです。

　iframeを使うと、同じ機能を果たせるとされていましたが、すべての場合に対応するわけではありません。特に1ページ内で個々の素材から、また、素材への要求をする時などがそうです。Ruby on RailsのフレームワークはもともとAjaxへのサポートが備わっており、私たちは、広範囲にわたって、iKnow!アプリケーション全体に使っています。

　Ajaxの主な利点の1つは、迅速であることで、筆者が効果やアニメーションを使わないことを薦める理由の1つでもあります。アクションを起こすことと、結果を得る間のループのフィードバックが迅速で、ページ全体をリロードする時間よりも早いのです。これは1つのページで多数のアクションを起こす時には重要です。Scriptaculous（http://script.aculo.us/）のようなスクリプト効果ライブラリとAjaxを混同しがちな人もいます。ともかく、これらの効果の使用は控えめにすることをお薦めします。

　フェードインのように、もし情報にアクセスする前に使われる場合など、何回も行われる移り変わる効果は、ユーザーが次のアクションを取るまでの時間を引き離します。動的なインターフェースや、フェードインは、プレゼンテーションにはいいかもしれません。しかし、多くの時間を費やすインターフェースの場合、これらの効果がいらいらさせることになり、全体的なUXを損なうことになります。

　Ajaxを使うことに不便なこともあります。これらの不便な点を理解することは、Ajaxの良い使い道を知る手段になります。Ajaxでレンダリングされたページはバックボタンのように、従来のブラウザコントロールには反応しません。それに、動的にレンダリングされた部分は、ブックマークするのが難しかったり、検索エンジンでインデックスされません。Ajaxは、コンテンツのパジネーションや、アプリケーションのメインおよびサブレベルのナビゲーションに対しては、最適な解決策ではないのです。

　おそらく最適とされる場所や、iKnow!アプリケーションでもっとも使われる場所は、マイリストへのアイテムの追加、写真のアップロード、ステータスメッセージの更新、コメント投稿などのユーザーの好みによるアップデートです。どこであろうと、瞬時のフィードバックがUXへの付加価値となる場所は、Ajaxを使うのに適しています。