2016年5月27日金曜日

高解像度対応の弊害... 私のやり方が悪い(^^;

MacのRetinaディスプレイがそうですが、高解像度ディスプレイではホームページに使う画像サイズを実際に表示するサイズよりも大きくしておかないとぼやけてしまいます。その理論は... 気になる方はググッて調べてみてください(^^;。

昨年Macに戻ってきたときにそのことを知らなかった私、最初は「どうしてだろう?」と調べてみたところ、そんな事実を知りました。結果、自分のホームページ「安芸の国から」ではsrcset属性を使って高解像度ディスプレイでは大きなサイズの画像を読み込むようにして、表示サイズを小さくしています。具体的には表示サイズが648x432なのに対し、画像サイズはその倍(面積で4倍)の1296x864としています。

しかし、大きなサイズの画像にすると当然ながらファイルサイズが大きくなります。対策のために圧縮率をあげているのですが、その弊害が下の写真。


高画質とか低画質(高圧縮率)とあるのは、photoshop elementsの設定の名です。高圧縮率のほうは青空のグラデーションがおかしなことになっています(>_<。

これまであまり意識したことがなかったのですが、やはりこういった弊害がでてくることがあるんですね。だからといって圧縮率を下げるとファイルサイズがかなりのものになるのでそれも難しく。どうしたもんだか。


0 件のコメント:

コメントを投稿