PNG画像は透過や半透明が使える？PNGファイル形式の特徴と利用用途 – 3種類のPNG（PNG8・PNG24・PNG32）を比較・紹介
PNG画像ファイルの概要や特徴を学び、PNGファイル形式の画像を適切な用途に利用できるようになりましょう。
PNGファイルについて知らない人はもちろん、いつもPNGファイルを利用している人もあらためてPNGファイルの特徴や利用用途について整理してみましょう。
画像ファイルには、いくつかのファイル形式があります。利用用途に合わせて画像ファイル形式を選ぶのが望ましいと言えます。もし適した形式の画像ファイルを利用できなければ、
- 必要以上に画像ファイルサイズが大きくなってしまう
- 画像の品質が変わってしまう
というようなことにもなりかねません。
PNGファイルについて学んで、正しく使えるようになりましょう。
なお、PNG以外の画像形式についても以下で紹介しています。
JPG・JPEG編
GIF編
まとめ編
- 目次 -
PNG形式の概要と特徴
PNG形式の概要
PNGとはPortable Network Graphicsという１つの画像ファイル形式です。拡張子「.png」がついたファイルが、このPNGと呼ばれる画像ファイルになります。
なお、PNGファイルには大きく以下３つの種類に分けられています。
- PNG8
- PNG24
- PNG32
上記の通り、PNG+数値で大別されています。数値は利用できる情報量(単位はbit)を意味しており、数値が大きいほど様々な情報を扱えるようになります。
各PNGにおける特徴を詳しくみていきましょう。
24bit PNGと32bit PNGの違い早わかり表
psy_re_（twitter:@re_psy）さんが当ブログを参考に24bitと32bit PNGの違いを図表にまとめてくれました。比較しやすいので是非ご覧ください。
直筆はパソコンには表現しきれない温かみがあって良いですね。掲載を承諾いただきましてありがとうございました。
PNG8の特徴と利用用途
PNG8の特徴
- 可逆圧縮（加工編集を繰り返しおこなっても画像が劣化しない）
- 256色のみサポート
- 透過処理が利用できる
- bit数が少ないため軽量
PNG8の利用用途の例
PNG8の利用に対する向き・不向きの例は以下になります。
WEBサイトにおける読み込み速度は画像のファイルサイズに大きく依存しています。WEBサイトで利用される画像はできるだけ軽量であることが望ましいと考えられています。
更にアイコン画像は、背景色や背景画像の上に重ねて利用することも少なくありません。そのため透過処理ができる画像形式が望ましいです。
こういった点から、軽量かつ透過可能なPNG8は、WEBアイコンに最適な画像ファイル形式として重宝されています。
256色しかサポートされていないので、単調な色合いの画像しか作ることができません。そのため、多彩な色合いを利用するグラデーションや鮮明な写真などを表現することはできません。
PNG24の特徴と利用用途
PNG24の特徴
- 可逆圧縮（加工編集を繰り返しおこなっても画像が劣化しない）
- フルカラー（16777216色）が利用可能
- 透過処理が利用できない
PNG24の利用用途の例
PNG24の利用に対する向き・不向きの例は以下になります。
フルカラーが利用可能なPNG24は多彩な色合いを利用するグラデーションや鮮明な写真に向いています。またJPG形式とは違い、何度でも加工・編集を繰り返し行うことができるため、グラデーションや写真を利用したグラフィカルなデザインをする際に適した画像形式と言えるでしょう。（ただし透過処理や半透明処理は行わないものに限ります。）
PNG24は透過処理が行えません。そのため背景の上に重ねて利用するような場合には不適です。具体的にはWEBサイトのアイコンやゲーム上で動くキャラクターデザインなどは背景画像の上で利用するため透過処理を必要とするため向いていません。
PNG32の特徴と利用用途
PNG32の特徴
- 可逆圧縮（加工編集を繰り返しおこなっても画像が劣化しない）
- フルカラー（16777216色）が利用可能
- 透過処理が利用可能
- αチャンネルを指定した半透明も利用可能
PNG32の利用用途の例
PNG32の利用に対する向き・不向きの例は以下になります。
PNG24同様にフルカラーが利用可能なPNG32は、多彩な色合いを利用するグラデーションや鮮明な写真に向いています。
加えて、PNG32は半透明の処理が利用でき、グラデーションに半透明を加えたり、写真を加工して半透明なデザインを重ねるというようなこともできます。そのためPNG32は高鮮度な画像や写真を加工したりすることに向いており、グラフィックデザインなどで利用できます。
PNG32はフルカラー・透過処理・半透明と高品質の画像を作成することができるため、どんな場面でも利用価値が高いです。もし挙げるとするならば、PNG32は機能性が高い分、情報をたくさん扱う画像形式のためファイルサイズ自体が必要以上に重くなる可能性があります。そのため、WEBサイトのように、軽量な画像が要求されるような場面ではあまり向いていません。
PNG形式を利用する際の注意点
各PNG(PNG8, PNG24, PNG32)を使いわける必要がある
上記で説明したとおり、PNGには３種類あります。利用用途に合わせて使い分けることができるので便利ではありますが、それぞれで特徴が異なるため注意が必要です。
たとえばフルカラーで制作した画像を保存するときに、PNG8を選択してしまうと256色だけしかサポートされません。サポート対象外のカラーを利用していた場合は、256色内の近い色で置換されてしまいます。そのため、気付くと「制作していた画像の色合いが全然違うことになってしまった。」なんてことにもなりかねません。
PNGファイル形式のまとめ
PNG画像ファイル形式は、PNG8, PNG24, PNG32というように用途別に３つの種類に分かれているため、幅広い画像制作に対応できる画像ファイル形式ですが、その分適したPNGを選択する必要があるため、TPOに合わせて適したPNGを利用するようにしましょう。
なお、いずれのPNG形式においてもロスレス圧縮（何度加工・編集を加えても画像ファイルが劣化されることがない）が利用できることや、必要に応じてPNG8, PNG24, PNG32を使い分けることができることを踏まえると、PNG形式は幅広い目的に合わせて画像を制作できる汎用的で便利な画像ファイル形式と言えるでしょう。
画像ファイル形式を紹介するシリーズ
第1弾：JPG・JPEG編
第2弾：PNG編
第3弾：GIF編
関連記事
