透明GIFを作ってみよう

透明GIFを作ってみよう！

透明GIFについて

　透明GIFとは、GIFのカラ-テーブルの中のある色を表示した時に透明にする機能のことです。この機能を使ったGIFファイルをwebブラウザ上で見ると、背景をうまく利用した画像になり非常に有効です。透明GIFは、対応しているブラウザでなければ機能しません、NetscapeNavigator2.0、Internet Exploder2.0、NCSA2.0a3、Cyeberdog1.2でサポ-トされているので特に問題はないと思います。

ここでは、MacintoshでPhotoshopの専用プラグを使った場合での方法を例にして説明します。
Windows版の場合は使用するツ-ルソフトは違いますが、使い方の概念はかわりません。

まず最初に必要なソフトをそろえる

　Macintoshで透明GIFを作る場合、
底番Photoshop3.0やGraphic Converter（シェアウェアソフト）があります。

Photoshopの場合「GIF89a Export」という専用プラグを使います。
「GIF89a Export」はPhotoshop6のインストールディスクの中にプラグイン (オプション)として納めてあります。

ちなみににWindows場合は、
「GIX PRO」というツ-ルソフトがあります。（シェアウェアソフトです。）
またこれらは、最近のパソコン誌のCD付録にもよくついていますので探してみて下さい。
どうしてもみつからない場合、専門誌でエ-アイ出版「新・HTML&CGI入門」という本の中の付録CDの中に、「Graphic Converter」と「GIX PRO」は掲載されてます。

透明GIFを作る下絵を準備する

　透明GIFにしたい絵をグラフィックソフトで作ります。
（Photoshopや、Graphic Converter等）グラフィックソフトで作成されたGIF形式の画像を用意します。
Photoshopは市販ソフトでグラフィックソフトの定版です。
Graphic Converterはシェアウェアソフトです、ダウンロ-ドを行い解凍して下さい。シェアウェアソフトなので登録が必要です。

それでは、サンプルを使って説明していきます。

　例：ここにfishS2.GIFというGIF形式の画像を用意しました。

fishS2R.GIF

ここで透明GIFにしたい絵の背景色を1色にしておくことがコツです。そしてその背景色は透明GIFにしたい絵の中にない色を指定しておくときれいに出来ます。

「GIF89a Export」を使って透明GIF画像を作る

　Photoshopのプラグインフォルダに「GIF89a Export」を入れておき、先ほど用意したfishS2R.GIFをPhotoshopへ呼び出してしてファイルメニュ-の出力用プラグの中で「GIF89a Export」を選択すると、下の画面が現われます。スポイドボタンで背景色の赤をクリックすると、赤が灰色に変わります。これで透明になったことを確認できます。これでOKボタンを押すと保存画面が出てきます、ファイル名をGIF形式にして保存すれば完了です。

この「GIF89a Export」を使った場合表示されているパレットの中の色を同じ様にスポイドボタンでクリックすると何色でも透明にできます。

HTMLファイルにタグを埋め込み確認する

　タグは普通の画像(GIFやJPEG)ファイルと同じ<IMG SRC="○○○○.gif">です。
うまく透明になったかブラウザーで確認して見ましょう。

　うまくできましたか、これで講座の終了です。
応用編としてアニメ-ション講座で学んだ方法と合わせるとどんな背景色のペ-ジでも一見透明に見えているようなアニメ-ション画像を表示できます。あとはみなさんの経験とセンスだけです。