スマホに合わせた解像度

Question

解像度の合っていない画像を直しているのですが、
縦横倍サイズで画像を制作し、cssなどで実際に表示するサイズ（半分）に縮小しています。

疑問なのですが、縦横サイズで縮小させず
画像を144dpiで作って使うことも可能なのでしょうか？

Answer 1

100px × 100px / 1ppi の画像と 100px × 100px / 100ppi の画像を作成してみてください。どちらもブラウザには「100px × 100px の画像」として同じように表示されるはずです。（ファイルサイズもほぼ同じになると思います）

基本的に dpi/ppi は印刷時に考慮する値なので、「画像を144dpiで作って使う」としても縦横倍サイズと同じことになるわけではありません。

Comments

[kana]

お返事が大変遅れまして失礼致しました！
試してみた所おっしゃる通りでファイルサイズはやや重くなりましたが全く同じ画像になりました。
無知な質問お恥ずかしく思います。。ありがとうございました！

Answer 2

解像度に関係なく画像を使うことはできますが、あまり大きなサイズになると読み込みに時間がかかるなどの問題があるため、基本的に適宜最適なサイズの解像度に落とし込みを実施します。

２秒サイトの表示が遅れるだけでコンバージョンが劇的に下がるような条件化ですので、
かつ画像は特に読み込みに時間がかかるため、スプライトやパネル化などさまざまな知恵を絞って0.01秒でも早く表示させようと勤めています。

ご質問の意図に合ったご解答ができたか少々不安ですがお力添えできていれば幸いです。

Comments

[kana]

ありがとうございます。
解像度を上げて見たところ容量が重くなるのに画像に変化はありませんでした。
やはり解像度を上げることは意味がないというか、デメリットしかないかなと思いました。
回答ありがとうございます！