Photoshop Elementsの色ずれ問題を解決する

Photoshop Elementsの色ずれ問題を解決する

Adobe Photoshop Elements のユーザーの多くは、写真を編集して保存し、Web サイトにアップロードしたにもかかわらず、元の画像ではきれいに見えた色が、ブラウザで表示すると不思議なほど色褪せて見えるという、苛立たしい経験をしたことがあるでしょう。私はこの問題の原因と解決策を突き止めるのにかなりの時間を費やし、その過程で、カラープロファイル、ブラウザの違い、そして Photoshop Elements の様々なファイル保存方法の特殊性など、想像もしていなかった多くのことを学びました。(そして、端的に言うと、Elements 自体は実際にはこの問題を効果的に解決できないものの、
より安価な GraphicConverter を使えば、使い方さえしっかり理解していれば解決できることも学びました。)

この問題に遭遇したことがある方、あるいは、これまで気づいていなかったけれど、私が注意すべき点を説明すれば気づくという方、役立つアドバイスがいくつかあると思います。もし急いでいて、フランスのペストリーやカラープロファイルの仕組みの細かい部分を読みたくない場合は、「実際に問題を解決する方法(注意事項付き)」まで飛ばしてください。ただし、背景情報として最後までお付き合いいただければ、きっと役に立つと思います。ここでは言葉がたくさん出てきますが、私が説明するようにすべてを設定すれば、ファイルを実際に使用できる形式に変換する作業は、わずか 1 回のクリックだけで 2 秒ほどで完了します。毎回長い手順を踏む必要はありませんが、何をして
いるのかをより深く理解すればするほど、期待通りに動作しない場合でも、より適切に対応できるようになると思います。

Cookshop Elements — フランスに移住するずっと前から、David Lebovitzのブログを定期的に読んでいました。Davidは長年、伝説のシェフ、アリス・ウォーターズが創業したバークレーの有名レストラン、Chez Panisseでパティシエとして働いていました。その後パリに移り住み、デザートに関する本の執筆、チョコレートツアーの開催、そしてフランスでの体験(もちろん、食に関するものを中心に)をブログに綴っています。知的で洗練された彼は、当然ながらMacユーザーです。

食べ物(特にデザート)、Mac、そしてパリという共通の趣味があったので、David にぜひ会いたいと思っていたのですが、どういうわけか、私がパリに来て約 2 年経った今年の夏まで会うことができませんでした。地元の料理本屋で David が開いたサイン会に行き、『The Sweet Life in Paris』のサイン本を手に入れ、彼と楽しい会話をしました。私の職業を話すと、彼はすぐに「ああ、それなら Photoshop Elements で困っている問題も解決してもらえるかもしれないね」と言いました。私は最善を尽くすと約束しました。私自身も Elements ユーザーであり、同僚で TidBITS 編集長の Jeff Carlson が Photoshop Elements に関する本を書いていることもあり、このプログラムによくある技術的な問題を解決できないのはプロとしての失態だと思ったからです。彼に自分のメールアドレスを教えると、後日、問題の詳細を送ってくれました。

彼が私に説明してくれた問題は、サンプル写真と、同様の問題を抱える他のElementsユーザーによるオンラインディスカッションへのリンクを示す長いURLリストを添えて、次のようなものでした。Photoshop Elements(または他の画像編集プログラム)で完璧にレタッチした素晴らしい写真があります。カメラのディスプレイ、iPhoto、Elements、そしてプレビューでも、色は美しく鮮やかに見えます。しかし、Webに公開され、ブラウザに表示される頃には、何かが起こっています。

ウェブ上の写真とMac上のオリジナル写真を並べて比較すると、ウェブ上の写真が鈍く、平坦な印象になっていることがわかります。すぐにお分かりいただけるように、この効果は設定によっては再現が少し難しいのですが、問題がわかるサンプル画像をご用意しました。左側が意図した色、右側がFirefox 3.0で表示された色です。(「オリジナル」ではなく「意図した色」としているのは、問題を強調するために元の写真を意図的に変更しているためです。)

画像

さて、どんな種類の写真を撮り、どのように使うかによって、この効果は(たとえ気付いたとしても)全く気にならないかもしれません。さらに、この効果はすべてのカメラやファイル形式で発生するわけではなく、Photoshop Elementsなどのプログラムで写真を加工したかどうか、また加工した場合の仕上がり具合によっても異なります。しかし、例えばプロの料理ライターで、ブログの読者に完熟したトマトや桃の美しさを伝えたいと考えているなら、これは非常に重要な問題です。

デイビッドは、写真を正しく保存できていないのではないかと直感しました。Elementsには「名前を付けて保存」と「Web用に保存」という2つのコマンドがあり、それぞれ動作が異なります。しかも、どちらも一般の人にとっては戸惑うようなオプションが多数用意されています。しかし、保存手順をあれこれいじっても効果はありませんでした。何時間もGoogle検索をしたり、ディスカッションフォーラムで提案されたヒントを試したり、Adobeに直接問い合わせたりしましたが(AdobeはElementsに問題はなく、それ以上のサポートは提供してくれないと主張しました)、デイビッドはひどく苛立ち、私に解決策を見つけてほしいと頼んできました。

調査を始めた当初は、この問題の原因が全く分かりませんでした。デイビッドはPhotoshop Elementsに問題があるのではないかと疑っていましたが、同時に、写真がホストされているFlickr、アップロード処理、あるいはブログソフトウェアに何らかの問題があるのではないかとも考えていました。そこで私はまず、Webでこの問題に関する情報を探し出し、それから様々な実験を行いました。まずは、デイビッドのカメラで撮影した写真の1枚をそのままの形で用意し、様々な方法で処理し、様々な方法で保存・アップロードし、様々なブラウザで表示してみました。色褪せたような外観を再現できた後、さらに様々な実験を行い、問題の原因と
回避策を探りました。

カラープロファイルの仕組み(と仕組み) — テスト中にわかったのですが、問題は「カラープロファイル」と呼ばれるものに関係しています。それまでは、カラープロファイルについて漠然とした知識しかありませんでした。Davidから聞いたこの問題に関する様々な議論を読んで、カラープロファイルについていくつか事実をまとめたいと思います。

デヴィッドのカメラ(および他の多くのカメラ)から取得したオリジナルの JPEG 画像には、画像の生データ(このピクセルはこの色、あのピクセルはあの色)だけでなく、カメラによって保存され、表示プログラムが色をどのように解釈すべきかを指定する「カラー プロファイル」と呼ばれるメタデータの塊も含まれています。(デヴィッドのカメラが写真に追加する特定のプロファイルは、写真を表示するプログラムに対して、彩度を上げるなどの指示を出すため、生画像データが生成するものより色が明るく豊かに見えるようになります。他のカメラのプロファイルは動作が異なる場合があります。)Photoshop(通常の Photoshop または Elements)は、そのプロファイルを問題なく読み込むことができます(さまざまなプロファイルを切り替えたり、写真からプロファイルを
完全に削除したりすることもできます)。Preview や Safari でも同様なので、これらのプログラムでオリジナルの画像を表示すると、色が期待どおりに見えます。

さらに、Photoshop (Elements など) で画像を調整し、[名前を付けて保存] または [Web 用に保存] を使用するときに適切な設定の組み合わせを選択すると、保存またはエクスポートされたグラフィックにも適切なカラー プロファイルが確実に設定され、プロファイルを正しく読み取るすべてのプログラムで再び完璧な外観になります。

つまり、あなたやあなたのサイトを閲覧する他のユーザーが常にSafari(カラープロファイルをサポート)を使用している場合、解決策は簡単です。必要なのは、保存方法の種類に関わらず、適切な項目にチェックが入っているか入っていないかを確認することだけです。そうすることで、カラープロファイルが保存された画像に埋め込まれ、WebページとMacのPhotoshop Elementsで表示される画像が同じに見えるようになります。

もちろん、誰もがSafariを使っているわけではありません。Firefox 3.5(それ以前のバージョンのFirefoxは対象外)もこれらのプロファイルを読み込むはずですが、私の実験では必ずしもそうではありませんでした。(ちなみに、リリースされたばかりのFirefox 3.6では問題は発生していません。)一方、Windows版Internet Explorerをはじめとするほとんどのブラウザは、これらのプロファイルを完全に無視するようです。つまり、Safariユーザーや、最新の高性能ブラウザを使っている幸運な少数のユーザーを除けば、画像を保存する際に適切なプロファイルが保持・含まれるように適切な対策を講じたとしても、最終的には何の問題もありません。

つまり、カラープロファイルは理論上は素晴らしいアイデアであり、カメラ/Mac/Safariの環境内では問題なく機能しますが、その範囲外に出ると全く役に立たなくなる可能性があります。どんなに工夫しても、画像の色が期待通りに表現されるようにプロファイルに頼っていても、そのプロファイルを尊重しないプログラムで画像を表示すると、正しく表示されません。

どうすれば問題を解決できるのか (でも実際にはできない) — では、多くのプログラムがカラー プロファイルを無視するため、カラー プロファイルに頼ることができない場合、プロファイルが尊重されているかのように画像を表示するにはどうすればよいでしょうか。

原理的には、解決策はシンプルです。写真編集ソフトウェアはプロファイルを削除し、その後、生のピクセルデータを修正することで、プロファイルが存在し使用されていた場合と同じ色の強調効果を与えます。この処理が実行され、正しく機能すれば、画像はどのプログラムでも同じに見えるようになります。画像にはプロファイルは存在しませんが、プロファイルによって提供されるすべての情報が元の画像に統合されるため、プロファイルは必要ありません。こうすることで、ブラウザがプロファイルを無視するかどうかは問題ではなくなります。

Photoshop Elementsの「Web用に保存」機能の一部がまさにこれを実行する、つまりカラープロファイルを画像自体に統合するだろうと、理性的な人なら誰でも思うでしょう。しかし、実際にはそうはなりません。そもそもそうならないのは、そもそもそのように設計されていないからなのか、それとも機能に欠陥があるからなのかは不明です。いずれにせよ、そのようなことは起こりません。

様々なウェブサイトで、Elements でカラープロファイルを統合するための秘術的な手法が紹介されていました。私はそれらを全て試しました。お香を焚いたり、適切な神々や悪魔に供物を捧げたり、マウンテンビューに向かって頭を下げて祈ったり、さらにはどのウェブサイトにも全く触れられていない、かなりオタクっぽいトリックを使ったりもしましたが、Elements は頑なにプロファイルの統合を拒否しました。

Photoshopのフルバージョンには、もしかしたら本当に問題を解決してくれるかもしれない、と教えられたのですが、試せるほどのフルバージョンのPhotoshopを持っていませんでした。それに、この時点でAdobeとその使いにくいプログラムにうんざりしていましたし、DavidもPhotoshopのフルバージョンにお金を払いたくないと言っていました。そこで、他の方法を探し始めました。

iPhotoや、あのお洒落なAcornなど、他にもいくつか画像編集ソフトを試してみましたが、どれもElementsと全く同じ動作でした。実際、AppleのApertureやAdobeのLightroomにもこの問題があると読んだことがあります!技術的には、どのプログラムも何も問題を起こしていません。つまり、カラープロファイルが存在する場合はそのまま残します。これは、通常であれば、そのプロファイルを使用する必要があるプログラムであれば、必ずそうするだろうという論理的な前提に基づいています。つまり、Adobeが「問題がない」と言っているのは、全くの
嘘ではありません。Elementsはデータを削除したり 画像を変更したりしているわけではなく、単に現実世界のほとんどの状況で明らかに必要な処理(オプションとして提供)をしていないだけです。これは他のほとんどの写真編集ソフトでも同様です。つまり、上記の開発者は、単に業界標準の動作に従っているだけだと主張することもできますが、そうすることは顧客のニーズに対する無関心を示すことになってしまいます。

実際に問題を解決する方法(注意点付き!) — いろいろと調べて実験を重ねた結果、ついにMac用プログラムを見つけました。Lemkesoftの名作GraphicConverter(34.95ドル)です。これは「カラープロファイルの結合」機能が明確に備わっているだけでなく、なんと実際に使えるのです! 様々な設定で何度もテストしてみましたが、毎回正常に動作しました。SafariやFirefoxなどで画像を表示しても、常に元の画像と全く同じように見えました。鮮やかな色彩も含めて。やったー!

GraphicConverter をご存知ない方のために説明しますと、名前はそうでも、実際には Photoshop に匹敵する機能を備えたフル機能の写真編集ソフトです。David には、Elements をやめて GraphicConverter を使い始めれば、おそらく望み通りの結果が得られるだろうと伝えました。しかし、彼も私と同じように、このプログラムの奇妙で時代錯誤なユーザーインターフェースを見て「うわっ!」と驚くのではないかと心配していました。本当に見栄えがよくありません。実際、少しでも標準から外れると、かなり扱いにくく感じます。インターフェースや習得の手間が気にならないのであれば問題ありませんが、多くの人は(当然ながら)Photoshop のよりモダンで(通常は)洗練されたアプローチを好みます。

嬉しいことに、プログラム名が示す通り、ドラッグ&ドロップでファイル変換ができるように設定できます。つまり、iPhotoやElementsなどで普段やっていることをそのまま実行し、Elementsでファイルを保存した後、Webサイトにアップロードする前にアイコンにドロップするだけで、GraphicConverterが処理してくれます(処理には約1秒かかります)。すると、元のファイルと見た目は全く同じですが、カラープロファイルが画像自体に統合されたファイルが生成されます。

これから、プロファイルを結合する GraphicConverter バージョンの「名前を付けて保存」コマンドを実行する方法と、ドラッグ アンド ドロップで変換できるように設定する方法の両方のテクニックについて説明します。

ちょっとした寄り道:Elements でプロファイルが保存されているか確認する— これから説明するプロセスが機能するには、写真にカラープロファイルが残っている必要があります。(Elements で画像が正しく表示されているからといって、プロファイルがそのまま残っているとは限りません。画像にまだカラープロファイルがない場合、Elements は独自のカラープロファイルをバックグラウンドで適用することがあるからです。残念。) Elements で画像を開いて、必要な操作を行った後は、プロファイルがそのまま残るように保存する必要があります。「名前を付けて保存」または「Web 用に保存」のいずれかで保存できますが、いずれにしても必ずこの操作を行ってください。(もし既に誤ってプロファイルなしで画像を保存してしまった場合は、この
寄り道の最後まで読み飛ばして解決策を確認してください。)

「名前を付けて保存」を使用してプロファイルを保存するには:

  1. Elements で画像を開いた状態で、「ファイル > 名前を付けて保存」を選択します。
  2. 「カラープロファイルを埋め込む」ボックスにチェックが入っていること、そして「フォーマット」が「JPEG」に設定されていることを確認してください。その他必要な変更(名前、保存場所など)を行い、「保存」をクリックします。JPEGのオプションをお好みに合わせて設定し、「OK」をクリックします。

「Web 用に保存」を使用してプロファイルを保存するには:

  1. Elements で画像を開いた状態で、「ファイル」>「Web 用に保存」を選択します。
  2. 右上隅のプリセットエリアで、フォーマットのポップアップメニューにJPEGが表示されていることを確認してください。その下にあるICCプロファイルのチェックボックスがオンになっていることを確認してください。次に(これは非常にわかりにくい部分ですが)、ヘルプボタンのすぐ左にある、円の中に三角形が入ったような小さなボタン(プリセットエリアの右上隅にある似たボタンとは別です)をクリックし、「ドキュメントのカラープロファイルを使用」の横にチェックマークが付いていることを確認してください。付いていない場合は、チェックマークを付けてください。その後、必要に応じてその他の変更を行い、「OK」をクリックします。

ここまでの説明は、対象の写真にまだプロファイルが埋め込まれていることを前提としています。もし写真のプロファイルが既に失われていたらどうでしょうか? 実際のピクセルは変わりませんし、Elementsでは問題なく表示されるかもしれませんが、ほとんどのWebブラウザで表示した際に画像の外観を維持したい場合は、まずプロファイルを再適用し、その後いくつかの手順を実行する必要があります。残念ながら、カメラののプロファイルを再適用する方法はわかりません。しかし、おそらくかなり近い別のプロファイルを適用すれば、少なくとも大まかな結果は得られるでしょう。手順は以下のとおりです。

  1. Elements で画像を開いた状態で、「イメージ」>「カラープロファイルの変換」>「sRGB プロファイルを適用」(「Adobe sRGB プロファイルを適用」ではありません)を選択します。注:このメニューコマンドが利用できない場合は、まず「プロファイルを削除」を選択すると、再び有効になります。
  2. 上記のいずれかの方法で画像を保存します。


「名前を付けて保存」方法— よし。次はGraphicConverterを使ってプロファイルを結合します。

  1. GraphicConverter で写真(カメラで撮影したばかりの写真でも、iPhoto からドラッグした写真でも、Elements で既に加工した写真でも構いません)を開きます。(初めて開くと、いくつかの追加機能をインストールするように促されますが、インストールするかどうかは自由です。ここではどちらでも構いません。また、ライセンスを支払わずにデモ版を実行している場合は、カウンターが切れるまでプログラムを実際に使用できません。)グラフィックをさらに加工したい場合は、今すぐ行ってください。
  2. [ファイル] > [名前を付けて保存] を選択します。
  3. フォーマットポップアップメニューから、JPEG/JFIF (*.JPG、*.JPEG) を選択します。
  4. 「カラープロファイルを画像に統合(Web用)」にチェックを入れます。その他のチェックボックスはそのままにしておきます。
  5. 通常どおり、ファイルに名前を付けて、保存する場所に移動します。
  6. [保存]をクリックします。
  7. 表示されるダイアログで、「品質」スライダーを希望の値(おそらく100)まで動かします。その他の設定はそのままにし、「OK」をクリックします。
  8. 泡立てて、すすぎ、追加の画像でこれを繰り返します。


「ドラッグ アンド ドロップ」方式— この方法では、最初に少し変わった設定が必要ですが、その後はドラッグ アンド ドロップするだけです。

一度だけの設定:

  1. GraphicConverter で、[ファイル] > [変換と変更] を選択します。
  2. 上部のポップアップメニューに「変換」と表示されるはずです。表示されない場合は、変更してください。
  3. [宛先フォーマット] ポップアップ メニューから [JPEG/JFIF (*.JPG、*.JPEG)] を選択します。
  4. [WWW Ready] ボックスがまだチェックされていない場合はチェックします。
  5. 「オプション」ボタンをクリックします。スライダーをドラッグして、希望する画質(おそらく100)に設定します。「OK」をクリックします。
  6. 「バッチの使用」ボックスがまだチェックされていない場合はチェックします (おそらくチェックされていないはずです)。
  7. 「バッチ編集」ボタンをクリックします。表示されるバッチウィンドウで、左側の「可能な機能」リストを下にスクロールし、「プロファイルを画像にマージ」を選択します。これを選択し、「追加」をクリックします。次に、「可能な機能」リストに戻り、「フォーマットの変更」を選択し、もう一度「追加」をクリックします。バッチテーブルリストで「フォーマットの変更」を選択すると、ウィンドウの下部に新しいフォーマットポップアップメニューが表示されます。このメニューからもJPEG/JFIF(*.JPG、*.JPEG)を選択します。「保存」ボタンをクリックし、「マージ」という名前を入力し、他の項目は変更せずに保存」をクリックします。最後に「OK」をクリックします。
  8. 変換と変更ウィンドウを閉じます。
  9. 私が作成したAppleScriptドロップレット「Merge Profiles」をダウンロードし、アプリケーションフォルダやデスクトップなど、使いやすい場所に置いてください。(まだ圧縮されている場合(「Merge Profiles.zip」など)は、まずダブルクリックして解凍してください。)このドロップレットは、GraphicConverterに、ステップ7で作成した「Merge」バッチ関数を使って、ドロップされたファイルを変換するように指示します。

実際の使用法:

  1. プロファイルを結合する必要がある 1 枚以上の写真を「プロファイルを結合」アイコンにドロップします。
  2. GraphicConverter がまだ起動していない場合は起動し、ファイルの名前を変更するか上書きするかを尋ねるダイアログが表示されます。ドロップしたファイル自体を変更する場合は、各ファイルごとに「上書き」をクリックしてください。
  3. ステップ3はありません。写真は変換されました。

なお、スクリプトの書き方は変更可能です。例えば、元の画像には一切手を加えず、変換した写真を指定したフォルダにコピーするだけです。そうすればステップ2は省略できますが、各画像のコピー(変換前と変換後)が2つ作成されます。これは必ずしも必要ではないかもしれません。もしそのようなスクリプトを作成したい場合は、もちろんAppleScriptドロップレットをご自身で修正することも可能です。詳細は読者の皆さんの課題として残しておきます。

すべてがうまくいっていることを自分自身で証明する方法— 結局のところ、せっかく苦労したのに期待通りの結果が得られなかった、なんて事態は避けたいですよね。そこで、まずはこの簡単なテストを試して、すべてがうまくいっているかどうかを確認することをお勧めします。

  1. 問題がはっきりとわかるカメラのオリジナル画像を撮影してください。(明るい赤色の場合、問題が最も顕著に現れるようです。)
  2. Photoshop Elements で画像を開き、通常どおりの操作を行います。
  3. ファイルを保存します ([名前を付けて保存] または [Web 用に保存] を使用しますが、上記のようにプロファイルを必ず含めてください)。
  4. ファイルを Flickr (またはお気に入りの Web アクセス可能な場所) にアップロードします。
  5. 2つのブラウザ(SafariとFirefox 3.0.x(またはカラープロファイルを正しく処理できない他のブラウザ))を開きます。Flickrページにアクセスし、新しくアップロードした画像を両方のブラウザで並べて表示します。
  6. Safari では色が正しく、Firefox では色が暗くなっていることがわかります。
  7. 次に、手順 3 で保存した同じファイルを Merge Profiles にドロップします。
  8. 修正したファイルをFlickrにアップロードし、SafariとFirefoxの両方で画像を開いてみてください。見た目が同じになっているはずです。


Digestif — プロファイルについて学び、この解決策を開発するという大変な作業を経て、私はDavidに自分の発見を説明しました。当然のことながら、彼はElements(彼はElementsをとても気に入っていたのですが)が期待通りに動作しないことに苛立ち、また別のプログラムにお金を払ってインストールし、使わなければならないことにも失望していました。こうした煩わしさには同情するばかりですが、私が提案した解決策は、私が思いつく限りの最良のものでした。

数ヶ月後、再びデイビッドに会った。彼は興奮気味に、問題が解決したと報告してくれた。しかし残念ながら、私の解決策のおかげではなかった。彼はPhotoshopのフルバージョンをインストールしてみることにしたのだ。ワークフローには一切変更を加えていないにもかかわらず、問題は発生しなくなった(少なくとも、以前ほど顕著ではなくなった)と。

これは私にとっては少々拍子抜けでした。彼が問題を解決してくれたのは嬉しかったし、私の解決策が使われたかどうかは特に気にしていませんでしたが、Photoshopのフルバージョンがどのような点で問題を改善しているのか、そしてなぜその機能がElementsにないのか、まだ分かりません。それでも、2009年のToDoリストから「David Lebovitzに会う」という目標を消し去ることができ、グラフィックスについてかなり学ぶことができたので、この取り組み全体は成功だと考えています。そして、もし私の発見が同じ問題を抱えている誰かの役に立つなら、それはまさに「最高の喜び」と言えるでしょう。

Idfte
Contributing writer at Idfte. Passionate about sharing knowledge and keeping readers informed.