Website Usability Info

Lightbox Plusは、Ajaxを使用したビューワーです。下記にサンプルを用意してみました（Lightbox Plusは残念ながら、「Ajaxによる画像の拡大」で指摘したモーダル表示になっているので、まずは下記サンプルの囲みの中にある説明をひととおり読んでから、操作してください）。

サンプル

画像をクリックすると、ブラウザのウィンドウサイズにフィットする大きさで拡大画像が開きます。

開いた拡大画像にマウスオーバーすると、左上にアイコンが表示されます（四方の外側に矢印が向いている図柄）。
このアイコンをクリックすると高解像度画像を原寸大で表示します。原寸大表示した高解像度画像は、ドラッグで表示する部分を動かすことができます。

高解像度画像を原寸大表示している状態で、左上に表示されているアイコン（四方の内側に矢印が向いている図柄）をクリックすると、ブラウザのウィンドウサイズにフィットする大きさに戻ります。そのうえで、任意の位置をクリックすると、拡大画像を閉じることができます。

（マウスが使えない場合は、こちらで高解像度画像ファイルを開きます）

高解像度画像をマウスでドラッグすると、表示する範囲を変更（移動）することができるわけですが、Lightbox Plusで便利なのは、全体のうち「現在の表示範囲はどこか」を示すインジケーターが（右下に）表示されることです。

敢えて細かい問題を挙げると、誤ってインジケーター内の四角形（図示のサンプルの場合、白い四角形）をドラッグして表示範囲を移動させようとするユーザーもいると思うので、そうした場合でも表示範囲を移動できれれば良いのにな、とは思いますが...（もっとも、この誤操作は、一度学習すれば解決できるレベルなので、そう大きな問題ではないと言えるかもしれません）。

なおLightbox Plusでは、（マウスのホイールを回すことによって）高解像度画像を表示する大きさを任意に変更することが可能です。原寸大よりも小さく表示して一度に見れる範囲を広くしたい、といったニーズを持ったユーザーにとっては、さりげなく便利な機能と言えるでしょう。