画像がぼやける場合の対応

ロゴの表示でpcだとクッキリなのにスマホとかだとぼやける現象が発生。
画像の解像度を上げるとスマホではくっきりするけど今度はPCでぼやけてしまう。
なので拡大縮小に対応したベクター画像にするためsvg形式で保存すること。ie9以上から。
・・・と思ったらphotoshopでsvgの書き出しが出来ない！svgで書きだそうとするとずっとローディング中になってしまう。。なので別の方法を検討

どうやらsvgへの書き出しが出来ないのはphotoshop cc 2018の不具合ぽい。なので2017にバージョンダウンしてみる。

2017版入れたらあっさりsvgの書き出しが出来た。バージョンダウンではなく2018と併存するぽい。
・・・がしかしsvg形式にしてみたらなんか表示がおかしい。画像を組み合わせてロゴ作ったのが原因なんだろうな。

もうsvgは諦めてメディアクエリでサイズによって読み込む画像を変える方法でやってみる。

・・・と思ったけどロゴとか重要な画像はcssでの表示をしない方が良いぽい。

なのでスマホ優先で実際の表示より少し大きめの画像をロゴにセットしてpcは多少ぼやけても我慢しておく。