Retinaでも画像をきれいにみせたい

私が使っているのは、iMac 27インチ、デュアルディスプレイにしていてEIZOの24インチを縦にして横においてます。
画面がでかくてほんとに快適ですが、webサイトをみているとたまに画像がボケボケなものを見つけます。
EIZOでみると普通、iMacの画面がRetinaといって、解像度2倍の鬼きれいなモニターだからですね、、。

なのでサイトを制作してるときも、100%の画像をそのままはめてもきれいには見えません。
だからって画像サイズを大きくすると、どんどんサイトが重くなってしまいますよね。

そういう場合は、Retinaやスマホなど用に大きいサイズの画像を用意して、
2倍の解像度のデバイスでみたときに、違う画像を表示するようにコードをかき分けます。

●htmlのimgタグではsrcsetで指定。

●CSSではメディアクエリを利用

いずれにせよ大きい画像は容量をくうので、、
カバー画像など大事な画像はRetinaでもきれいにみせたいですね^^

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

top