「JPEG（JPG）」,「PNG」,「GIF」の違い

ホームページで利用される画像種類（画像フォーマット）は主に「JPEG」「PNG」「GIF」となります。
どの画像種類を使えば良いかは、使用する画像の内容や用途にとって異なります。一般的に「JPEG」が多く利用されますが、文字ベースの画像などの場合は「JPEG」は見づらくなることがあります。

以下で画像の形式を変更することが出来ますので、実際に変換してご確認ください。

画像フォーマットによる主要な違いは以下となります。

画像の内容によりサイズは異なります。一般的に「写真はJPEG」「アイコンはGIF,PNG」と言われていますが、画像の内容や用途により画像フォーマット（画像種類）を選択する必要があります。
（注）下記サンプルは一般的な変換を使用しています。品質や圧縮の指定によってファイルサイズは大きく異なりますのでご注意ください。

	JPEG (詳細)	PNG (詳細)	GIF (詳細)
写真
	303KB	965KB	451KB
	○ サイズが小さい	△ サイズが大きい	○ サイズは小さい
	○ 画像が滑らか	○ 画像が滑らか	× 画像が荒い
テキスト
	28KB	6KB	4KB
	× サイズが大きい	○ サイズは小さい	○ サイズは小さい
	× 文字が不鮮明	○ 文字が鮮明	○ 文字が鮮明
派手な テキスト
	35KB	40KB	14KB
	× サイズが大きい	× サイズが大きい	○ サイズが小さい
	○ 画像が滑らか	○ 画像が滑らか	× 画像が荒い

GIFは256色までとなりますが、見た目では256色あればフルカラーと大きな違いはありません。
写真など綺麗に見せたい場合はフルカラーがおすすめとなりますが、ホームページのアイコンやイラストであれば256色でファイルサイズの小さいGIFでも十分となります。

	JPEG (詳細)	PNG (詳細)	GIF (詳細)
色数	フルカラー 24bit 16,777,216色	フルカラー 24bit 16,777,216色	8bit 256色
色の 見た目
	27KB	4KB	12KB
	見た目に大きな違いはない
部分拡大 すると
	○ 滑らかに表示される	○ 滑らかに表示される	× 粗い表示となる

透過を使用したい場合は「JPEG」は使用できません。また、半透明を使用する場合は「PNG」を使用する必要があります。

	JPEG (詳細)	PNG (詳細)	GIF (詳細)
透過対応	透過非対応	透過対応 1色対応 半透明対応	透過対応 1色対応
一部透過
	19KB	3KB	2KB
	× 透過しない	○ 透過する	○ 透過する
半透明
	17KB	3KB	2KB
	× 半透過しない	○ 半透過する	× 半透過しない

アニメーション

アニメーション画像を使用する場合は「GIF」を使用する必要があります。

	JPEG (詳細)	PNG (詳細)	GIF (詳細)
アニメーション	アニメーション 非対応	アニメーション 非対応	アニメーション 対応
一部透過
	18KB	6KB	55KB
	× 動かない	× 動かない	○ 動く

GIFアニメーションは、以下のページ作成できます。

以下で画像変換や圧縮が可能ですのでぜひお試しください。