質問: Webのサイトを作成している中で、画像を大量に使わないといけない状態になり、元の画像サイズを小さくしようとしております。 今回使用する画像は、こちらのサイト(http://tokuna.blog40.fc2.com/blog-entry-1634.html)にあるような沢山の画像を使用した一つの画像なので、スマホなどでピンチアウトした際、なんの画像の集合体なのかも分かるようにしなければなりません。 Photoshopを使用し画像解像度から横幅640pxにリサイズしようとした所、pixelの単位が選べなかったので調べてみたら再サンプルにチェックいれないと単位が選べないことは分かったのですが、いざ再サンプルにチェックをいれ640px(比率固定)にリサイズをすると、画像を拡大して見た時に画像が荒くなってしまいました。 サイトの画像として使用するには4000×3000では大きすぎるので、どうにかRetinaディスプレイの事を考えた640pxくらいまで小さくしたいのですが、この状態ではこの画像の良さが伝えられない状況です。 こういった場合、皆様でしたらどう対処するのか、ご意見を伺いたいと思います。 どうぞ宜しくお願い致します。
回答: 状況や見せたい画像の内容にもよりますが、タイル画像を生成してズームするという方法はあります。 【OpenSeadragon - こんな細かく!ズーム対応の画像ビューワー MOONGIFT】 http://www.moongift.jp/2015/10/openseadragon-こんな細かく!ズーム対応の画像ビューワー/ 【Zoomify Free】 OpenSeadragon用の画像も Zoomify用の画像も Leaflet というタイル表示ライブラリで表示できるようにするプラグインがあったと思います。 【Plugins - Leaflet - a JavaScript library for interactive maps】 Leaflet 単体でも当然できます。(タイルを用意していれば) 【Extending Leaflet, New Layers - Leaflet - a JavaScript library for interactive maps】