PNG画像の色が変だぞ
とあるサイトの編集中、思わぬトラブルに見舞われてしまった。
サイトで使用されている既存の画像を編集し、再アップしたところ、画像の色が合わない。
画像はPNG形式で、編集にはPhotoshopを使用した。試しに、画像には手を加えず、「別名で保存」しただけでも色が変わってしまう。編集するアプリを変え、FireWorksで開き「名前を付けて保存」してみるが、これもまた違う色になってしまった。
しかも、どうやらブラウザによっても色の見え方が違うようだ。
下のサンプルは実際にそのサイトで使用した画像と、それをアプリケーションで開きPNG形式で別名で保存したもの。一見同じに見えるものもあるが、他のブラウザで見ると色に違いがでてくるものもある。
|
|
左から、オリジナル画像、Mac Photoshopで開き保存した画像、Mac Fireworksで開き保存した画像、Mac Previewで開き保存した画像、Mac Previewで開き保存し、さらにPhotoshopで開き保存した画像 |
|
|
左から、オリジナル画像、Windows Photoshopで開き保存した画像、WindowsFireworksで開き保存した画像、Windows Paintで開き保存した画像 |
オリジナル画像の「色番号」を調べてもPhotoshopでは「#C1AC7B」Fireworksでは「#CBB88C」となってしまう。GoogleChromeで見ると、上記左側オリジナル画像と左から2番目の画像は明らかに色が違うにもかかわらず、Photoshop上では「#C1AC7B」と色番号は同じである。
残念ながら今のところ良い解決法は見つからず、、、
教科書通りに「Webセーフカラーを使う」しかないのだろうか？