Illustrator　WEB用に保存するとサイズがずれる (07/05/24)

イラストレーターで作った画像をWEB用に保存すると1pxほど画像がブレます。
イラストレーター上ではベクター形式で黒一色のきれいな画像だったとしても、フォトショップで見るとグレーがまじったり線が太くなったりという、ボケが生じるのです。
これはイラストレーターの画像がそもそもビットマップ画像でないせいです。
画像形式の変換過程で1pxほどのずれが生じるので、イラストレーターで作った画像は直接WEB用に使うことはさけたほうが無難です。

また、フォトショップ形式などに書き出しても1pxのズレは出ます。
このズレは右辺と下辺にばかり出るようで、偏っている分、より目立ちます。
ですので、イラストレーターの画像をWEB用に保存するには、72dpiでなく大きめの解像度で保存し、フォトショップで開きなおして加工ましょう。

次の手順は一例です。

　　１．イラストレーターで画像を作る。
　　２．ファイル　＞　データ書き出し　＞　Photoshop　＞　保存
　　　　※カラーモードをRGBに解像度を標準(150ppi)を選んでOK
　　３．保存したファイルをフォトショップで開く
　　４．拡大して見ると右辺と下辺に1pxの透明部分か色のブレがあるので切り取るなど修正を加える
　 　　　（わかりにくい場合は1600%まで拡大して確認）
　　５．イメージ　＞　画像解像度　でWEB用のサイズを入力（解像度はそのままで良い）
　　６．ファイル　＞　WEB用に保存

イラレとフォトショを行き来しないといけないのは面倒ですが、WEBは1pxずれても目立ちます。
このひと手間をかければ、より素材の完成度を上げることが出来ます。