グラフィックの情報です。

画像形式の選択

画像の品質と容量の関係

解像度やサイズの大きな画像は高品質ですが、このままだと容量が大き過ぎるため一般用途で使用するには向きません。
また、こうした高品質な画像の場合は使用する色数も多いため、画像形式も大抵はPNG24/32かJPEGになります。

  1. 高品質画像:高解像度、サイズが大きい、色数が多い
  2. 低品質画像:低解像度、サイズが小さい、色数が少ない

高品質画像の最適化

高品質な画像を素材として利用するためには、リサイズして最適化する事で適切なレベルにする事ができます。
また、リサイズしたくない場合は、画像形式を適切なものに変換すると容量を小さくする事ができます。
特にWeb上で利用するような画像の場合は、このあたりが重要になります。
画像最適化ソフト

縮小して最適化、最適な画像形式に変換など

画像形式の特徴

画像形式の特徴

画像形式の特徴は以下のようになります。
PNGとは
JPEGとは
GIFとは

  1. PNG8:容量は小さめ、劣化しない、透過に対応、色数は256色(非常に優れた画像形式ですが、色数は制限されます。)
  2. JPEG:容量は小さめ、劣化する、色数はフルカラー/1677万色(フルカラー対応で容量が非常に小さいですが、上書きすると劣化します。)
  3. PNG24/32:容量は大きめ、劣化しない、透過に対応、色数はフルカラー/1677万色(フルカラーに対応していますが、容量が大きめです。)
  4. GIF:アニメーション画像や透過画像に対応、色数は256色(特殊な画像に対応していますが、色数は制限されます。)

PNG8とJPEG

一般的な画像形式でよく利用されるのがこの2つですが、どちらも特性が違うので用途に合わせて選択する必要があります。
基本的には色数の少ない小さめの画像や透過・加工が必要な場合ならPNG8が最適ですが、色数の多い大きめの画像ならJPEGになるようです。
最適な画像の書き出しは、JPG, GIF, PNG、どれを使うべきか (その画像形式でいいですか?)

  1. 色数の多い大きめの画像:JPEG
  2. 色数の少ない小さめの画像、透過や加工を利用する:PNG8

PNG24/32の対策

PNG24/32の画像は容量的に大きくなるため、そのまま利用するのは効果的ではありません。
対処法としてはリサイズと最適化を行ってPNG8にするか、JPEGに変換すればサイズをそのままに容量だけを削減する事ができます。
レタッチソフト
画像加工ソフト

  1. PNG8に変換する:PNG24/32画像をリサイズ→最適化
  2. JPEGに変換する:JPEGに変換

GIFの機能性

GIF画像は利用できる色数は少ないですが、アニメーションや透過が利用できます。
特に画像でアニメーションが利用できるのはGIFだけなので、特殊な画像を利用する際に重宝されています。

GIFの特殊機能:透過、アニメーション画像

次世代の画像形式

FLIF

FLIFはPNGより40%以上も高圧縮な新しい画像形式です。
今後の主流になるのではと言われていますが、まだブラウザなど周辺対応が整っていません。
FLIF技術
UGUI FLIF(FLIFビューワー)

BPG

BPGはJPEGの半分以下の容量で同程度の画質を保つ事ができる新しい画像形式です。
今後はJPEGに代わってこのファイル形式が主流になる可能性があります。
ただし、現時点ではブラウザなどの対応が進んでいないため、そのままではサイト上で表示できません。
BPG技術
Romeolight BPGconv(BPG変換ソフト)
BPGのSusieプラグイン

APNG

APNGはアニメーション効果のある新しい画像形式です。
従来では画像でアニメーションを作る場合はGIFしかありませんでしたが、今後はこのAPNGでも作成が可能なようです。
ただし、こちらもまだそれほど広まってはいません。
APNG技術
ApngComposite(APNG作成ソフト)
APNG Assembler(APNG作成ソフト)

オンラインPC館
TOPページテクニックPC → グラフィック