Photoshop5.xでのGIFとJPEGの操作

作成:10.9.1998
改訂:10.11.1999
対応Photoshopバージョン:5.0、5.5


ここではWebページでよく利用される、GIF形式とJPEG形式 ファイルのPhotoshop5.xを用いた操作を紹介いたします。
Photoshop5.5以上では「Web用に保存...」コマンドを使用してください。


Photoshop講座へ戻る ホームページへ戻る

GIF/JPEG形式のファイルを開く

PhotoshopはGIF、JPEGファイルとも直接オープンすることができます。[ファイル]メニューから目的のファイル名を指定して開くか、画像ファイルをダブルクリック(Windowsの場合はファイルの拡張子がPhotoshopと関連付けされている必要があります)します。

ただし、GIFはインデックスカラーモードで扱われるため、そのままではフィルタの使用などに制限を受けます。この場合、一旦[イメージ]メニューの[モード]で[RGBカラー]を選択しRGBカラーモードで作業します。


GIF形式でファイルを保存する

これにはいくつかの方法があります。

その1:RGB画像から出力モジュールを使う

  1. [ファイル]メニューの[データ書き出し]から[GIF89a書き出し...]を選択します。次のようなダイアログが表示されます。ちなみに「GIF89a」の"89a"とはGIFの(規約の)バージョンです。



  2. 「パレット」には適応させる色パレット、「インターレース」にはインターレースGIF形式で格納するかどうかを指定します。


  3. [OK]をクリックすると、ダイアログボックスが表示されるので、ファイル名を指定して保存します。




その2:インデックスカラーにしてから保存する

  1. [イメージ]メニューの[モード]から[インデックスカラー...]を選択します。このとき、画像にレイヤーが存在すると、それを統合するかどうか聞いてきます(統合しないとモード変更はできません)。


  2. 「パレット」、「色数」、「ディザの種類」を選択します。なお、「ディザ」とは減色するときの色の捨て方で、「誤差拡散法」では色を拡散させ、色の境界を目立たなくします(多くの場合、「なし」と比較するとできあがりのファイルサイズは大きくなります)。図は4.0Jの画面です。


  3. [ファイル]メニューの[別名で保存...]または[複製を保存...]で「Compuserve Gif」を指定して保存します([保存]でもかまいませんが、新規イメージでない限り、もとのファイルが上書きされてしまいます)。



  4. 次のようなダイアログが表示されるので、「インタレースGIF(ブラウザでの読み込み時、徐々に鮮明になるような展開の仕方をするファイル)」にするかどうか、指定します。




  5. 注意
    [保存]または[別名で保存...]の場合、画像にアルファチャンネルが複数あると、保存できません。またアルファチャンネルが1つの場合、それが透明化の範囲として使われます。これを防ぐ場合は、[複製を保存...]か、GIF89a出力モジュールを使用します。



その3:インデックスカラーモードで出力モジュールを使う

  1. インデックスカラーモードで、[ファイル]メニューの[データ書き出し]から[GIF89a書き出し...]を選択します。次のように先のものとは違うダイアログが表示されます。このとき、スポイトツール()を使ってイメージ上をクリックすると、特定の色を透明化する「トランスペアレントGIF」にすることができます(続けてクリックすると、次々に透明化する色を選択できます)。
    また、透明にする範囲をアルファチャンネルにしていれば、「透明度」のドロップダウンリストで選択できます。


  2. [OK]をクリックしてからファイル名を指定し、保存します。


その4:「透明画像の書き出し」ウィザードを使う(Photoshop5.0以上・トランスペアレントGIFを作成したいとき)


Photoshop5.0から搭載された、「透明画像の書き出し」ウィザードでは、トランスペアレントGIFを対話的なインタフェースで作成することが可能です。

  1. あらかじめ、透明にする部分を選択しておくか、画像を透明なレイヤーの上においてから、[ヘルプ]メニューの[透明画像の書き出し...]を選択します。
    次のようなダイアログが表示されます。




  2. [次へ]をクリックして、あとは画面の指示に従って操作します。このウィザードでは、GIF形式のほか、PNG(ピング)形式(画像劣化がなく、なおかつ画像の透明化も可能な形式。ただし、比較的新しいバージョンのブラウザでないと表示できません)の画像も作成可能です。


その5:RGBモードから別名保存で保存する(Photoshop5.5以上)

Photoshop5.5からは、[別名で保存...]コマンドの実行時に対象となる画像をインデックスカラーモードにすることが可能です。

  1. RGBカラーモードで、[ファイル]メニューの[別名で保存...]から[Compuserve GIF]を選択します。次のようなダイアログが表示されます。

    ここでは、対象画像に適用するパレット、色数、ディザ(などを指定します。5.0以前のバージョンとは、ダイアログが少し異なります。

  2. [OK]をクリックしてから、「インタレースGIF」にするかどうか、およびファイル名を入力して保存します。


JPEG形式でファイルを保存する

その1:別名で保存

  1. [ファイル]メニューの[別名で保存...]を選択し、形式に「JPEG」を指定して[OK]をクリックします。次のようなダイアログが表示されます。


  2. 画質(高くすると圧縮率は低下し、ファイルサイズは大きくなります)、プログレッシブの適用などを指定します。なお、プログレッシブやベースライン(最適化)のJPEG形式は、古いブラウザでは表示できません。


その2:複製を保存

[ファイル]メニューの[複製を保存...]を使い、形式に「JPEG」を指定します。このコマンドは現在の画像の表示状態で別ファイルを作成できます。
なお、非表示状態のレイヤーは格納されません。


Web用に保存(Photoshop5.5 以上)


Photoshop5.5では、通常の保存コマンドのほかに、[Web用に保存...]が加わっています。

  1. [ファイル]メニューから、[Web用に保存...]を選択します。次のようなダイアログが表示されます。



  2. 「元画像」、「最適化画像」、「2アップ」、「4アップ」のタブで画面が切り替わります。図は4アップのものです。

  3. このダイアログでは、次の操作が可能です。
  • オリジナルを含めて最大4つまで、画像のGIF/JPEG/PNG変換後の状態を調整およびプレビューできる
  • 任意のブラウザを起動して画像をプレビューできる
  • 画像サイズの変更(ダイアログ右下の「画像」タブ)


注意!


次のような場合はGIFやJPEGで保存できません(保存のダイアログでファイル形式がグレーになって選択できません)。

1.画像に複数のレイヤーが存在するとき

解決策その1:上記の「複製を保存」を使 います。但し、GIFの場合はあらかじめインデックスカラーになっている(結局、レイヤーを統合する)必要があります。

解決策その2:すべてのレイヤーを統合します。上書き保存したらもとのファイルは一巻の終わりなので、[ファイル]メニューの[別名で保存...]の使用をおすすめします。


2.Photoshop5.5より前のバージョンでRGB画像を直接GIFで保存しようとしたとき

解決策その1:GIF89a出力モジュールを使用します。

解決策その2:インデックスカラーモードに変換してから保存します。

3.アルファチャンネルが複数ある、インデックスカラーモードの画像を「保存」または「別名で保存」コマンドを使ってGIF形式で保存しようとしたとき

解決策その1:GIF89a出力モジュールを使用します。

解決策その2:「複製を保存」を使用します。

解決策その3:アルファチャンネルを削除してから保存します。


4.アルファチャンネルがある画像をJPEG形式で保存しようとしたとき

解決策その1:「複製を保存」を使用します。

解決策その2:アルファチャンネルを削除してから保存します。

5.インデックスカラーモードの画像をJPEG形式で保存しようとしたとき

解決策:RGBやCMYKカラーモードにしてから保存します。