ディザ

ほとんどの Web 画像は 24 ビットカラー表示(1600 万色以上の表示)を使用して作成されていますが、8 ビットカラー表示(256 色のみの表示)のコンピューターで Web ページを見ているユーザーもいます。このため、Web 画像には、一部のコンピューターでは表示できないカラーが含まれていることがよくあります。コンピューターは、ディザというテクニックを使用して、表示できないカラーをシミュレートします。ディザは、隣り合った異なるカラーのピクセルを使用して、別のカラーを作り出します。例えば、赤色と黄色をモザイクパターンでディザ処理すると、8 ビットカラーパネルに含まれていないオレンジ色のように見えます。

ディザ処理による連続階調のシミュレート
ディザ処理による連続階調のシミュレート

注意:

Web パネルのカラーを使用すると、256 色表示の Windows または Mac OS システムで表示してもディザ処理が発生しません。元の画像を作成するときに、カラーピッカーを使用して Web セーフカラーを選択することができます。

画像を最適化する場合、実行されるディザ処理は 2 種類あります。

アプリケーションのディザ処理

GIF および PNG‑8 画像で、Photoshop Elements が現在のカラーテーブルにないカラーをシミュレートするときに実行されます。アプリケーションのディザ処理の場合、ディザ処理のパターンを選択して制御できます。また、テーブルにカラーを追加して、アプリケーションのディザ処理を回避することもできます。

ブラウザーのディザ処理

8 ビットカラー(256 色モード)を使用して表示するときに、Web ブラウザーが 8 ビットカラーパネルにないカラーをシミュレートするときに実行されます。ブラウザーのディザ処理は、GIF、PNG または JPEG 画像で行われます。Photoshop Elements で、画像内の選択したカラーを Web セーフ カラーにシフトすることで、ブラウザーのディザ処理の度合いを抑制できます。また、カラーピッカーでカラーを選択するときに、Web セーフカラーを指定することもできます。

アプリケーションのディザ処理は、GIF および PNG‑8 画像でプレビューできます。単色が主体の画像では、ディザ処理を行わなくても正常に表示される場合があります。逆に、連続階調カラー(特に色のグラデーション)を含む画像の場合は、カラーバンディングを防ぐためにディザ処理が必要です。

Web 画像でのディザの制御

  1. 画像を開いて、ファイル/Web 用に保存を選択します。
  2. 最適化設定を選択します。
  3. 「ディザ」テキストボックスに値を入力するか、ディザメニューの矢印をクリックし、表示されるスライダーをドラッグします。
  4. ディザ処理のパーセント値によって、画像に適用されるディザ処理の度合いが制御されます。ディザ処理のパーセント値を高く設定すると、画像の色数が増え、ディテールが鮮明になりますが、ファイルサイズも大きくなります。最適な圧縮を行って最適な表示画質を得るには、必要なカラーディテールを再現するのに十分な最少のパーセント値を使用します。

ディザのプレビュー

ブラウザーのディザ処理は、Photoshop Elements で直接プレビューするか、8 ビットカラー表示(256 色モード)を使用するブラウザーでプレビューできます。

  1. 画像を開いて、ファイル/Web 用に保存を選択します。
  2. 最適化設定を選択します。
  3. ディザを Photoshop Elements でプレビューするには、Web 用に保存ダイアログボックスのドキュメントパネルメニューから「ブラウザーディザ」を選択します(メニューを表示するには、最適化した画像の右上にある三角形をクリックします)。
  4. ディザをブラウザーでプレビューするには、次の手順に従います。
    • コンピューターのカラー表示を 8 ビットカラー(256 色)に設定します。カラー表示の変更方法については、オペレーティングシステムのマニュアルを参照してください。

    • Web 用に保存ダイアログボックスのプレビューメニューからブラウザーを選択します。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー