「サイトに掲載した写真、ChromeとSafariで色が違う気がする」「Windowsで開くと色が変わった」——こういった現象に気づいたことはありますか?実は、同じJPEGファイルでも、開くソフトウェアによって色の見え方は確かに変わります。
これは不具合ではなく、各ブラウザや画像ビューワーがカラープロファイルをどう扱うかの違いによるものです。このコラムでは、その仕組みと実際の対処法をわかりやすく解説します。
カラープロファイルとは何か
デジタル写真のファイルには、画像データだけでなく「この色はどういう色空間で定義されているか」という情報が埋め込まれています。これをカラープロファイルと言います。代表的なものにsRGB・Adobe RGB・Display P3などがあります。
プロカメラマンが納品する写真は、Web用にはsRGBで書き出すのが一般的です。ただし、ブラウザや画像ビューワーがこのプロファイルを正確に読み取れるかどうかは、ソフトウェアによって異なります。プロファイルを無視したり、誤って解釈したりすると、色が変わって表示されてしまいます。
ブラウザによる色の違い
主要ブラウザのカラープロファイル対応状況は以下のとおりです。
| ブラウザ | カラープロファイル対応 | 特徴 |
|---|---|---|
| Safari(Mac/iPhone)推奨 | ◎ 非常に優秀 | Apple製品はOSレベルでカラーマネジメントを統合管理。Display P3も対応しており、写真の色を最も正確に近い状態で表示できる。 |
| Chrome(最新版)良好 | ○ 良好 | sRGBプロファイルには対応済み。ただしDisplay P3など広色域のプロファイルは対応が限定的な場合がある。最新版ほど正確。 |
| Firefox(最新版) | ○ 良好 | カラーマネジメント対応。設定によってはデフォルトで無効になっていることがある。 |
| Edge(Chromiumベース) | ○ 良好 | ChromiumエンジンのためChromeに準じた挙動。 |
| IE・古いブラウザ注意 | ✕ 非対応・不安定 | カラープロファイルを無視して表示するため、色が飽和する・コントラストが変わるなどの問題が起きやすい。現在は使用されていないことがほとんど。 |
実際にChromeとSafariで同じ写真を並べて見比べると、彩度や色温度がわずかに異なることがあります。どちらが「正しい」かと言えば、カラーマネジメントの観点ではSafariがより正確に近い表示をしていることが多いです。
画像ビューワーによる違い
ブラウザ以外の画像ビューワーにも同様の差があります。特に問題になりやすいのがWindowsの標準ビューワーです。
Windowsフォト(標準):カラープロファイルの対応が不完全なことがある。特にAdobe RGB埋め込みの写真を開くと、彩度が過剰に高く見えることがある。
Macのプレビュー:AppleのColorSync技術により、カラープロファイルを正確に処理。信頼度が高い。
Adobe Bridge / Lightroom:プロ用ツールのため最も正確。カメラマンが確認に使う環境に最も近い。
iPhoneの写真アプリ:Display P3対応のディスプレイとOSレベルの管理により、実用上最も正確な確認ができる。
iPhoneの写真アプリが「最も正確に近い」理由
前の記事でも触れましたが、iPhoneはディスプレイ・OS・アプリが一体となってカラーマネジメントを行っており、一般的なWindows PCより写真の色を正確に再現します。
特にiPhone XS以降のモデルはDisplay P3という広色域規格に対応しており、sRGBを超えた色情報も正確に表示できます。プロカメラマンが編集した写真のニュアンスをそのまま見られる可能性が、他の環境より高いのです。
ブラウザで確認する場合は、Mac + Safariの組み合わせが最も信頼できます。WindowsのChromeも最新版であれば概ね正確ですが、モニター自体の色精度に依存するため、iPhoneで確認する習慣をつけておくことをおすすめします。
Webサイトに掲載する写真はどう確認すべきか
コーポレートサイトや採用サイトに写真を掲載する際、最終確認はできれば以下の3つの環境で行うのが理想です。
① iPhone の Safari または 写真アプリ——最も信頼できる基準
② Mac + Safari——Appleのカラーマネジメントが生きる組み合わせ
③ Windows + Chrome 最新版——一般的な閲覧環境の代表として
この3つで色・明るさが大きく違わなければ、掲載後に「色がおかしい」とクレームになるリスクは低いです。
なお、「プロが納品した写真がモニターで変な色に見える」原因がモニター側にある場合については、前の記事「カラーキャリブレーションの話」で詳しく解説しています。合わせてご覧ください。