マルチメディアチュートリアル - GIF イメージ

GIFはWeb上で使用される主要な画像フォーマットの1つです。

この記事では、GIF画像の特長と使用技術を詳細に説明しています。

画像フォーマットの理解

HTMLやXHTMLには画像の公式フォーマットは定義されていません。しかし、人気のあるブラウザは特定の画像フォーマットを規定しており、通常はGIFとJPEGです。他のマルチメディアフォーマットは特別なサブアプリケーションが必要で、各ブラウザのユーザーはこれらのアプリケーションを取得し、インストールし、正しく操作する必要があります。そのため、GIFとJPEGがWeb上の実際の標準となることが不思議ではありません。

Webが登場する前に、これら2つの画像フォーマットは広く使用されており、多くのサポートソフトウェアがこれらのフォーマットで画像を作成するのに役立ちました。しかし、これらのフォーマットにはそれぞれ長所と短所があり、一部のブラウザはその特性を利用して特別な表示効果を実現します。

GIF

GIFフォーマットとは、画像交換フォーマット（Graphics Interchange Format、GIF）のことで、このフォーマットは最初にCompuServeがオンラインサービスのユーザーに画像を転送するために開発しました。

GIFフォーマットの特徴

GIFフォーマットには多くの特徴があり、そのためHTML/XHTMLでは非常に普及しています。

まず、その符号化技術は多くのプラットフォームで使用できます。したがって、適切なGIFデコードソフトウェア（多くのブラウザにはこのソフトウェアが含まれています）を使用して、Macintosh上でGIFファイルの画像を作成および構成し、WindowsベースのPC上でも簡単に読み込んでデコードし表示することができます。

GIF フォーマットの第2つの特徴は、特別な圧縮技術を使用して、画像ファイルのサイズを大幅に小さくすることができることです。そのため、ネットワーク上での転送がより速くなります。また、GIF 圧縮は「無損」圧縮であり、画像内の元のデータは変更も失われることもありません。したがって、解凍およびデコードされた画像は元の画像と完全に同じです。

また、GIF画像はアニメーション効果を実現するのが非常に簡単です。

GIF形式のバージョンと色

GIF画像ファイルはすべて .gif（または .GIF）でファイル名のエンディングを使用していますが、実際には2つのGIFバージョンがあります：オリジナルのGIF87およびGIF89a、後者は透明背景、クロスストレージおよびアニメーションなどの多くの新しい機能をサポートしており、これらの機能はウェブクリエイターの間で非常に普及しています。

現在の人気のあるブラウザはこれらの2つのGIF形式をサポートしており、8ビットのピクセル値を一つの色テーブルにマッピングする同じ方法で動作しています。したがって、各画像には最大256色が可能です。

大多数のGIF画像の実際の色の数は少なく、MacromediaのFireworksなどの特殊ツールがより詳細な画像でこれらの色を簡略化できます。色を簡略化することで、より小さな色イメージを作成し、ピクセルの冗余を強化し、ファイルの圧縮をさらに多く行い、ダウンロード速度を速めることができます。

しかし、色の数が限られているため、GIFでエンコードされた画像はいつでも適用されるわけではありません。特に、写真のようにリアルな効果を持つ画像に対して、それは特に適用されません。GIFは非常に美しいアイコンや色が少ない画像や絵画を作成するために使用できます。

非常に厳格なクリエイターでさえもGIFを選択します

ほとんどのグラフィックブラウザが明示的にGIF形式をサポートしているため、現在インターネット上で最も広く受け入れられている画像エンコーディング形式です。インライン画像と外部リンク画像の両方を使用できます。画像形式を選ぶ際に迷ったら、GIFを使用するのは間違いありません。ほぼすべての状況で正常に使用できます。

GIF画像の技術

GIF画像には3つの特別な技術があります：交互スキャン（インターレース）、透明性（トランスペアレンシー）およびアニメーション（アニメーション）。

交互スキャン

交互スキャンを通じて、GIF画像はスクリーン上に一気に表示され、上から下に順次表示されるのではなくです。一般的には、GIFでエンコードされた画像は、画像の上から下に順次、行ごとに並ぶ一連のピクセルデータのシーケンスです。したがって、通常のGIF画像がスクリーン上に表示される際には、カーテンを一気に開くように見えますが、交互スキャンのGIF画像が表示される際には、カーテンを開くように見えます。これは、ピクセルデータのシーケンスが4行ごとに交互に交错しているためです。ユーザーは、一つの画像全体を表示するのに必要な時間の四分の一で、上から下に非常に完全な画像を見ることができますが、それも非常にぼやけます。この四分の一で完成した画像は通常すでに十分に明確であり、これにより、ネットワーク接続速度が遅いユーザーも、画像の残りの部分をダウンロードする必要があるかどうかを判断することができます。

すべてのグラフィックブラウザは交互スキャンされた GIF を表示できますが、すべてのブラウザが交互スキャンの徐々に鮮明になる効果を表示できるわけではありません。この効果を実現できるブラウザであっても、ユーザーは画像が完全にダウンロードされ、デコードされた後に表示するように選択することで、この効果を抑制できます。古いブラウザは常に画像が完全にダウンロードされ、デコードされた後に表示するため、この効果をサポートしていません。

透明性

GIF 画像（実際には GIF89a フォーマットの画像）の別の一般的な効果は、画像の一部を透明にすることができ、その結果、画像の下の内容（通常はブラウザのウィンドウの背景）が透明部分を通して表示されることがあります。透明な GIF 画像は、背景色として特別な色を使用するため、表示ウィンドウの背景が透けて見えます。画像のサイズを慎重にカットして、接近する純色の背景色を選択することで、透明画像をウェブページに完全に埋め込んだか、浮いているかのように見せることができます。

透明な GIF 画像は、ドキュメントに組み込むことを希望するが、方块的に見えたくないあらゆる形状の画像に適しています。透明な GIF ロゴは非常に一般的で、透明なアイコンや印刷符号など、任意の自然形状の画像にこの効果を使用できます。また、特殊な文字符号を表示するために、伝統的なテキストに透明なインライン画像を挿入することもできます。

GIF 画像の透明効果の問題点は、超リンクのアンカー（<a>）タグ内に含まれていて枠線を外していない場合や、フレームで括られていない場合に見た目が非常に悪くなることです。さらに、他のコンテンツは画像の矩形枠線の周りに表示され、画像の不透明な枠線に近づく代わりに表示されます。その結果、不必要に画像を分離したり、ウェブページが非常に奇妙に見えることがあります。

アニメーション

GIF89a フォーマットの画像の第3の特徴は、単純なフレームごとのアニメーションを実現できることです。特別な GIF アニメーションツールソフトを使用することで、一連の GIF 画像を単一の GIF89a ファイルにまとめることができます。ブラウザはファイル内の各画像を連続して表示し、私たちが子供の頃に遊んだ（または描いた）ように、速くページをめくることでアニメーション効果を出す小冊子のようなものです。GIF ファイルでは、各画像間に特別な制御部分があり、ブラウザが全体のシーケンス（ループ）を何回表示するか、2つの画像間の停止時間、ブラウザが次の画像を表示する前に背景から画像スペースを消去するかどうかなどを設定できます。これらの特性を GIF が通常持つ特性（単独の色指定、透明性、交互スキャンなど）と組み合わせることで、非常に魅力的で緻密な画像を作成できます。

シンプルなGIFアニメーションが強力な効果を持つもう一つの重要な理由は、HTMLドキュメントにプログラムを特別に書かなくてもアニメーション効果を得られることです。しかし、それには非常に大きな欠点があり、それは非常に小さいアイコンサイズのグラフィックやブラウザウィンドウの非常に狭い一帯にのみ限定されていることです：連続したアニメーションユニットの中で静的な部分を繰り返さないように非常に慎重にすることでも、GIFアニメーションは非常に大きくなりやすいです。したがって、ドキュメントに複数のアニメーションが含まれている場合、これらの画像のダウンロード遅延がユーザーに非常に不快に感じられることがあります。GIFアニメーションを使用する際に非常に慎重に扱われ、悪用されないように注意すべき特性は、それはGIFアニメーションです。

まとめ

シンプルなGIFアニメーションが強力な効果を持つもう一つの重要な理由は、HTMLドキュメントにプログラムを特別に書かなくてもアニメーション効果を得られることです。しかし、それには非常に大きな欠点があり、それは非常に小さいアイコンサイズのグラフィックやブラウザウィンドウの非常に狭い一帯にのみ限定されていることです：連続したアニメーションユニットの中で静的な部分を繰り返さないように非常に慎重にすることでも、GIFアニメーションは非常に大きくなりやすいです。したがって、ドキュメントに複数のアニメーションが含まれている場合、これらの画像のダウンロード遅延がユーザーに非常に不快に感じられることがあります。GIFアニメーションを使用する際に非常に慎重に扱われ、悪用されないように注意すべき特性は、それはGIFアニメーションです。