何となく画像形式を選んでいませんか？

BMP、GIF、JPEG…どれを使えばよいのでしょう？

　Webページを作る時に、画像はなくてはならない存在です。写真や図を掲載するのはもちろん、インパクトのあるタイトルや装飾枠など、ページを彩る要素としても多用されます。

　Webページに使う画像には主に「JPEG（ジェイペグ）」と「GIF（ジフ）」があるのはご存じの方も多いでしょう。しかし、私たちの日常の制作作業では、Adobe Photoshopなら「PSD」、Adobe Illustratorなら「AI」、ペイントなどが「BMP」と画像ソフトによってさまざま形式があり、使い分けています。

　これらを直接Webで利用できればさらに便利なのに、なぜJPEG、GIFでなければならないのでしょうか。また、この両者の違いはなんでしょうか。今回は、そんな画像形式の基本を紹介していきます。

　今でこそブロードバンドが当たり前ですが、回線速度が遅かった当時はデータをやりとりするのにも大変時間がかかりました。ちょっとした画像でもすぐに数MBといった容量になってしまうため、PhotoshopデータやIllustratorデータをそのままやりとりしたり、表示するのは難しかったのです。そこで生み出された技術が、データを内容はそのままにサイズを小さくする「圧縮」という技術です。

　現在でも一般的にソフトウエアなどをダウンロードする時は、「ZIP」や「LZH」といった形式のファイルをダウンロードし、「解凍」はまたは「伸張」という作業を行ってから利用します。この、ZIP等が「圧縮ファイル」と呼ばれるものです。

　画像についても例外ではなく、この「圧縮」を施して受け渡ししていました。そして、当時アメリカでパソコン通信ネットワークサービスを展開していた「CompuServe」が、「GIF」という圧縮形式を開発し、サービス内で利用していました。そのほかにも、日本で主に利用されていた「MAG」等の形式がありましたが、インターネットのWeb技術でサポートされたのがこの「GIF」だったのです。

圧縮画像、GIFの特長

　GIFは、単なる画像形式にとどまらず、次のような3つの特長を持ち合わせています。

　1つ目は、「透過GIF」です。

　GIFには「透過」という概念があり、Webブラウザ上で画像を重ね合わせた時に、背景の画像を透かすことができます。これにより、格段に表現力が上がります。

　2つ目は、「インターレースGIF」です。

　通常、データは前から順番に受信されるため、画像であれば左上から右に向かって、そして次の行の左から右に向かってという具合にデータが届きます。すると、画像は上から徐々に表示されていきます。

　しかし、これではなかなか画像の全体像を確認することができず、ストレスを感じてしまいます。そこで、「インターレースGIF」は最初に、あらかじめ全体の大まかな情報を取得し、あとから細かい部分を取得していくことができます。これにより、画像はモザイク状の画像から、徐々に粒子が細かくなっていくという表現をすることができるため、画像の内容を認識する時間が早まるというわけです。

　3つ目は、「アニメーションGIF」です。

　GIFの最も特徴的な点が、このアニメーションGIFです。複数のGIF画像をまとめて専用ツールで編集することで、ぱらぱらアニメのようなアニメーションを作ることができます。拡張子は静止画像と同じ「.gif」で、通常のWebブラウザで表示することができるため、簡単なアニメ等の表現に多用されています。

　今はFlashが一般的になっているため、大規模なアニメーションは少なくなりましたが、プラグインを必要とすることなくアニメーションが使うことができることから、今でもさまざまな場面で活用されています。

　このようにさまざまな機能があるGIFですが、1つだけ非常に大きな欠点があります。それは扱える色数が250色程度しかないことです。ロゴマークやイラストであれば、この程度の色数でも十分なのですが、写真やグラデーションのかかった画像などでは、とてもこの色数ではまかなえません。

　そこで、利用されている画像形式が「JPEG」です。