1. GIFアニメーションのもとになる画像を用意する

　GIFアニメーションは数枚の画像をコマ送りで表示します。そのため、そのコマ送りに使用する画像を用意する必要があります。普段から使っているグラフィックソフトで連続した動作の画像を数枚作成して、それらをGIFアニメーションにすることができます。

　また、GIFアニメーションを作成するソフトによってはQuickTimeムービーをコンバートしてGIFアニメーションを作ることもできます。QuickTimeを作成するソフトウェアで動画を作成し、それをGIFアニメーションにできます。動画を作成するアプリケーションではPICT形式などでコマ送りの画像をファイルに落せるので、それらをGIFにコンバートしてGIFアニメーションを作ることもできます。

2. GIFアニメーション作成ソフトを利用する

　GIFアニメーション作成ソフトを利用して画像や動画からGIFアニメーションを作ります。GIFアニメーションを作るソフトウェアは、Mac OS、Windows 95/NT、UNIXなどほとんどのプラットフォームにあります。GIF Animation on the WWW JAPANでは、まず、GifBuilder 1.0を使ったGIFアニメーションの作成チュートリアルを紹介する予定です。GIFアニメーションが作成できる主なソフトは以下のとおりです（Illustratorは試してませんけど・・・）。

GifBuilder 1.0 (for Mac OS)

HVS Animator (for Mac OS)

GraphicConverter (for Mac OS)

Adobe Illustrator 8.0J (for Mac OS and Windows95/NT)

SmallGIF (for Mac OS)

Gif・gIf・giF

　まずは、しっかりとGifBuilder 1.0のチュートリアルを作る予定です。上記のソフトでチュートリアルの作成を希望される方はリクエストをぜひお知らせください。リクエストが多いものについては作成します。

3. HTMLのimgタグでGIFアニメーションのファイルを指定する

　画像を表示させるためのimgタグでGIFアニメーションをHTMLファイルで指定します。通常のGIFやJPEGファイルの指定となんら変わりません。

例：<img src="season.gif" width="50" height="50" border="0" alt="春夏秋冬">

4. ブラウザでGIFアニメーションを表示する

　ブラウザでGIFアニメーションを指定したHTMLファイルをオープンするとGIFアニメーションが表示されます。現在では、GUIベースのブラウザではそのほとんどがGIFアニメーションをサポートしています。下はGIFアニメーションの表示例です。

　上の3の例で示したimgタグは、この上の画像（春夏秋冬の文字を1つづつ表示する画像）を表示させるものです。GifBuilder 1.0で作成しました。