JPEG/Webで使う画像形式

■ Tips　JPEG画像フォーマット

JPEG(Joint Picture Experts Group)形式 (拡張子が .jpg または .jpeg) は GIF形式の次によく使われるフォーマットで、長所と欠点があります。

主な長所とは、元の画像ファイルが同じ場合、概して GIF よりもファイルサイズ (容量) が小さくなり、閲覧者がダウンロードするのにかかる時間が短くてすむことです。また、カラーパレットも GIF形式より圧倒的に多く1670万色がサポートされています。

JPEGは、256色しか扱えない GIF に不満を持つ閲覧者が増えてきたことによって、ブラウザ各社がサポートするようになったフォーマットです。フルカラーを扱うことが可能で、風景や人物、商品など写真のイメージを表示するのに適しています。

欠点としては、GIF のように特定の色を透過したり、アニメーション化することはできません。また、ファイルのダウンロードにかかる時間をせっかく短縮しても、ブラウザが画像を解凍して表示するのにかかる時間で相殺されてしまうことがあります。ただし、JPEGは GIF のインターレスと同じようなプログレッシブ機能を使うことができます。

現在、HTML4.0以降の規格には、img タグで読み込めるフォーマットのひとつとして記載されていますので、以前ほど JPEGの利用をためらうことがなくなっています。

■ JPEGの留意点

JPEGから GIF形式の変換は行わないでください。JPEG画像の写真を GIFに変換すると、JPEGが対応しているフルカラーのカラーパレットが、GIFのカラーパレット256色に変換されてしまうからです。非常に汚い画像になり、見るに耐えません。

一般的に JPEGはファイルサイズを小さくしたいときには最良のフォーマットですが、もとの画像が白黒の場合には当てはまらないことがあります。JPEG形式の圧縮方式は、白黒でなくカラー画像用に最適化されています。その結果、多くの場合、白黒画像だと同じ画像でも JPEGよりも GIF形式の方がファイスサイズを小さくなります。

`JPEG`形式と `GIF`形式との比較

`JPEG`フルカラー 8.34KB	`GIF`に変換 11.5KB	`GIF`モノクロ 8.73KB

■ プログレッシブJPEG

プログレッシブとは、ブラウザに表示されるときに、通常は画像が読み込まれたときに表示しますが、この機能を使うと徐々に画像が現れて、見る人にイライラ感を与えないような仕掛けになっています。これは標準JPEG画像形式の新しいバリエーションです。

プログレッシブJPEGはインターレースGIFよりずっとスムースに表示され、ファイルサイズも通常の JPEGと比較しても大きくなりません。場合によっては元の JPEGより小さいことさえあります。

ただし、残念ながらこの形式に対応した Webブラウザの銘柄は限られています。形式が認識できないブラウザではまったく表示されず、画像が「壊れている」ことになってしまいます。

今のところ当方で検証したところでは、表示できない視覚系ブラウザの確認はしておりません。プログレッシブJPEGは　W3Cでも公開されている規格なので、ほとんどが表示できると思います……（？)

■ JEPG画像の最適化

圧縮率を上げすぎるとイメージが汚くなってしまいます。Webページにおける画像の大きさや扱う枚数を考慮し、適切な圧縮率を選択するようにします。

圧縮率による画質の違い

`JPEG`フルカラー 8.34KB	`JPEG`フルカラー 4.11KB

初版公開日 2002年5月1日最新更新日 2002年11月11日

■ Tips JPEG画像フォーマット

■ Tips　JPEG画像フォーマット