HPで使える画像の形式

今回はHPで使える画像の形式(種類)について解説しましょう。「画像を表示しなさい」と言う命令文を記述すれば、どのような形式でも表示されるのではありません。一般的にWEBページ上へ貼り付けることができる画像は、今から紹介します3個の形式だけです。もし、自分で画像を作成・加工される場合は、それぞれの形式をよく理解したうえで次のいずれかの中から最適な形式で保存するようにして下さい。

GIF 形式(拡張子:gif)
イラストや幾何学模様など色数が少なく、色と色の境がはっきりとした画像に適した形式です。 画像の一部を透明にしたり、アニメーション画像を作成したりすることもできます。 256色以上の色を使用できない、と言う欠点もあります。
gif sample1(8.24kb)  gif sample2(18.3kb)
JPEG 形式(拡張子:jpg、jpeg)
写真など色数が多く色が複雑に絡み合っている画像に適した形式です。 1670万色まで表示できます。 イラストや幾何学模様など平坦な画像をこの形式で保存すると、境目がにじんだようになりますので注意が必要です。
jpeg sample1(20.6kb)  jpeg sample2(24.4kb)
PNG 形式(拡張子:png)
イラストや幾何学模様など色数が少なく、色と色の境がはっきりとした画像に適した形式です。 理論上最大で280兆色まで扱うことができます。 また、圧縮率が高く同じ画像のGIFファイルより10%〜30%程度ファイルサイズが小さくなります。 複数の透過色を指定できる、という特徴もあります。 ただし、アニメーションできない、フルカラーにするとJPEGよりファイルサイズが大きくなる、 古いブラウザでは表示できないなどの注意点もあります。 (表示できるブラウザはIE5.5以降、NN4以降です)
png sample1(9.21kb)  png sample2(50.7kb)

ここで一つ注意点を挙げておきます。上記の解説では「WEBページ上に貼り付けることができる画像」と言う事で紹介をしていますが、これは正しい表現ではありません。正しくは「一般的なブラウザで表示することができる画像の形式」と言うことです。画像の中には「TIFF 形式」と言う画像もあるのですが、こちらの画像形式をサポートするブラウザで見れば、「TIFF形式の画像」をページ上で表示することも可能です。