私は2台のMacと2台のWindowsボックスを持っています-それぞれのスクリーンショットを撮ると(画面も見て...)、Windowsマシンと1台のMacは同じように見えますが、私のMacは異なって見えます。どうして?どうすれば修正できますか?
例として、動作するMac:
そうでないMac:
これを機能させるために何を変更しますか?
タグなしの画像を使用して作成したため、背景色が異なると思います。問題は、各アプリケーションがタグなしの画像/色を異なる方法でレンダリングするためです。
から OS Xの色の不一致 :
サファリ/カラーピッカーでは、タグなしの画像はモニターの色域に基づいてレンダリングされます.I2010 mbp 15を使用している場合、適切なキャリブレーション後、色域はsrgbに近くなりますが、完全に一致しないため、色の変化があります。
このWebサイトを読んで、ブラウザのタグなし画像について理解を深めることをお勧めします。 http://www.gballard.net/psd/go_live_page_profile/embeddedJPEGprofiles.html
つまり、すべてのブラウザで画像を同じようにレンダリングする場合は、カラープロファイルを組み込む必要があります。古いブラウザの中には気づかないものもありますが、最近のほとんどのブラウザは気づいています。
この問題は、上記のembeddedJPEGprofilesリンクで明確に説明されており、デモと、画像にカラープロファイルを組み込む方法についてのアドバイスがあります。
これはガンマ関連の問題です。 10.6では、デフォルトのガンマは2.2(PCと同様)になり、以前はすべてのMacで1.8でした。 2.2はあなたの目に「暗い」です。
あなたは、この問題を解決するためにモニターを調整できると考えていました。 OS Xでスクリーンショットを撮ると、ディスプレイのガンマ値が結果の画像に埋め込まれます。両方のディスプレイを2.2のガンマに設定すると、同じ明るさの設定でより近くに見えるはずです(または、少なくとも異なるマシンで撮影されたスクリーンショットは、単一のマシンで正しく表示されるはずです)。
きれいなスクリーンショットが必要ですか、それはPNGですか?
Pngcrushを使用してファイルからカラープロファイルを削除し、それがクリアされるかどうかを確認してください。
ほとんどのOSとブラウザでこれを修正するには、次の手順を実行します。
色の一貫性は頭痛の種です-これをすべてのマシンとすべてのブラウザで同じように表示する方法がないことはほぼ確実です(キャリブレーションを想定している場合でも!)。しかし、私たちは最善を尽くすことができます。
ICCプロファイルを埋め込むと、ifが尊重され、画像の表示に使用される色空間を制御でき、色の一貫性を保証できます。プロファイルがないと、SafariはsRGBではなくモニターの色域で色をレンダリングするため、問題が発生しています。最初のMacで問題なく表示される唯一の理由は、モニターの色域がたまたまsRGBと一致するためです。
背景色を設定するためにRGBコードでCSSスタイルを使用しています。 CSS3標準では、この背景色のレンダリング方法を制御するためのカラープロファイルを含めることができる color-profile プロパティが提案されていますが、残念ながら ほとんどブラウザはありません まだこれを実装しています。
CSSの代わりにカラープロファイルを背景として(たとえばタイリング)含むタグ付き画像を使用すると、画像内のICCプロファイルタグを尊重するすべてのブラウザーで一貫性を確保できます。残念ながら、これはすべてのブラウザではありません(たとえば、IEはそうではありません)。したがって、最初の私の概要では、どこでも一貫性を得ることができるという保証はありません。
目的の色を使用して小さな画像を作成し、sRGBプロファイルでタグ付けして、これを背景として使用することをお勧めします。これにより、ほぼすべての場所で一貫性が得られるはずです(IE/WindowsはとにかくすべてにsRGBを想定しているため)。