GIFとJPGどう違う - そしてPNGは? その2

理屈を述べてもしようがないので(本当は理屈を用意するのが面倒なので)実例をお見せします。

昔懐かしいPACKMANのイメ−ジを左に三つならべました。 このイメ−ジを見て「アタリ」という言葉が思い浮かんだ方は、 人生も半ばにさしかかっているはずです。 「はずれ」という言葉が思い浮かんだ方は・・・いるわけないか。

GIF(2KB)
pack.gif
PNG(2KB)
pack.png
JPG(18KB)
pack.jpg

それぞれのイメ−ジの上にファイル保存形式とファイルサイズを書いてあります。 オリジナルの画像は黒、赤、黄、オリ−ブ色の4色しか使用していません。 私が1分で描いた縦横ともに240ピクセル(画素)の単純なイメ−ジで、 描いた後それぞれの画像形式でつづけて保存したものです。 このような手書きのイメ−ジは、その上手下手は別として、 インタ−ネットでよく使用されていますから、 その取り扱いを誤ると、 ファイルサイズが大きいわりには見栄えの悪いイメ−ジを インタ−ネット上に氾濫させることになってしまいます。

さて、これらのイメ−ジはみな同じように見えます。 元々同じイメ−ジを保存したものですからそれが当然のように思えます。 確かに、 GIFとPNGの違いはこのイメ−ジでは(理論上も実際上も)見分けられません。 けれども、目の良い方が高級なデスプレイとビデオボ−ドのセットでご覧になると、 JPGの画像がちょっと違うということに気づかれるかもしれません。 もうひとつ歴然とした違いがあります。それはファイルサイズです。 JPGのファイルサイズがGIFやPNGの10倍ほどにもなっています。



上のイメ−ジの一部を4倍に拡大してGIFとJPGの違いを見てみましょう(下図)。 異なる色の間の輪郭がGIFではシャ−プで、 オリジナルのイメ−ジと全く同じです。 一方、JPGの方では輪郭に滲みがあります。

GIF(1KB)
packp.gif
JPG(17KB)
packp.jpg

以上のことから判ったことは、4色の手描きイメ−ジを三つの形式で保存し、 その後表示させた場合:

ということです。

ファイルサイズが大きくて、イメ−ジが勝手に変化(しかも汚くなる)するのなら、 JPGって何のためにあるの? という疑問が湧くのは当然です。

それでは次の例を見ましょう。 インタ−ネットでは写真イメ−ジも数多く使用されていますので、 上と同じような比較を写真イメ−ジでやってみます。 下の三つのイメ−ジを較べて見てください。 オリジナルはデジカメで撮影したフルカラ−のTIFFイメ−ジです (TIFFの意味がわからない場合は気にしないでください)。

GIF(14KB)
simas.gif
PNG(33KB)
simas.png
JPG(4KB)
simas.jpg

少なくともこのサイズでは三枚の写真の品質の違いが見えません。 手っ取り早く結論を言ってしまえば、 同じ写真イメ−ジを三つのファイル形式で保存した場合:

PNG → JPG → GIF

の順で品質が落ちてゆくのが普通です。 「普通です」と表現したのは、 写真の場合は品質に関する基準が曖昧なことと、 写真の色合いの違いなどで結果が異なる場合があるからです。

品質にそれほど大きな差がなくとも、 写真のように輪郭が曖昧でピクセル(画素)毎の色の変化の激しいイメ−ジの場合、 JPGには大きな利点があります。 ファイルサイズをご覧下さい。

まとめると次のようになるでしょうか:





あとがき

JPG形式では品質を指定して保存できる (高品質であるほどファイルサイズが大きくなる)とか、 GIFやPNGでは色数を指定可能(多色なほどファイルサイズが大きくなる) といった特徴があるなど、実際はもう少し複雑なのですが、 それらをしっかりと解説するためにはビット、 バイト、パレット、圧縮アルゴリズム、RGBなどの、 出来れば避けて通りたい(説明が説明を呼ぶ)言葉が続々登場しそうなので、 この辺に留めておきます。 ここで解説した特徴を覚えておけば、 インタ−ネット用の画像を保存する際の形式を選び損ねることはないでしょう。