画像ファイルの種類と特徴について書きました。いくつか種類があるので、その特徴を知り、使い分けます。
gif
Graphics Interchange Format(グラフィックス・インターチェンジ・フォーマット)の略です。フルカラー(約1670万色=256×256×256=16777216色)のうちの256色までしか表現できません。色数が限られているため、容量は比較的小さくなります。透過できます。
主な用途は、ロゴやアイコンです。他にgifアニメーションにして、アニメーションさせることができます。
jpg(jpeg)
フルカラー(約1670万色)を表現できます。非可逆圧縮方式のため、保存を繰り返すと画像は劣化します。
主な用途は、写真です。
png
Portable Network Graphics(ポータブル・ネットワーク・グラフィックス)の略です。PNGは何種類かあります。その違いは、扱える色数の違いです。
png-8
フルカラーのうちの256色までしか表現できません。gifの代替として使えます。png-8は、透過できます。
主な用途は、ロゴやアイコンです。
png-24
フルカラーを表現できます。jpgの代替として使えます。
主な用途は、写真です。容量は大きくなります。
その他の保存形式
svg
Scalable Vector Graphics(スケーラブル・ベクター・グラフィックス)の略です。伸縮してもぼやけず綺麗です。XMLベースのため、テキストエディタで編集できます。JavaScriptと連携させることができます。一部、svgに対応していないブラウザがあります。
主な用途は、ロゴやアイコンです。
参考サイト
画像の種類
ラスター画像
四角形の画素(ピクセル)の集まりで画像を表現します。画像を拡大すると四角形の集まりであることが分かると思います。拡大すると輪郭がぼやけます。写真向きです。
ベクター画像
ベジェ曲線で線を描きます。数式で線を描くため、拡大しても鮮明に表示できます。輪郭がぼやけず、綺麗です。ロゴ、アイコン向きです。イラストレーターで作った画像は、ベクター画像です。