「PNG」とは、「Portable Network Graphics」の略称で、主にWebで使用されることを目的に開発された可逆圧縮形式の画像フォーマットの一種です。
今回は「PNG」に焦点を当て、その概要や特徴、メリット・デメリット、画像変換ツールなどをご紹介します。気になるポイントを一挙確認してしまいましょう。
「PNG」とは？
「PNG」とは、「Portable Network Graphics」の略称で、主にWebで使用されることを目的に開発された可逆圧縮形式の画像フォーマットの一種です。
「PNG」は1996年にGIFの代替として開発され、後にW3CやIETF、ISOなどの標準化団体によって規格化されました。
当初、画像フォーマットといえばGIFが主流でしたが、2000年代初頭には主要なWebブラウザや画像編集ソフトなどがPNGに対応し、標準的に利用される画像形式の1つとなりました。
【PNGの基礎情報】
「PNG」の形式
「PNG」には、3つの形式(「PNG-8」「PNG-24」「PNG-32」)があります。
後ろの数字(8、24、32)は、「PNG」で扱えるデータ量を表し、「PNG-8」は「8bit分のカラーが扱えますよ」という意味です。
bitの計算は「2のn乗」で計算をするため、8bitでは「2の8乗＝256色」、24bitでは「2の24乗=約1677万色」になります。
しかし、注意点としては32bitが「2の32乗」ではないということです。
実際は「24bitの色数 + 8bitの透明」の形式になります。
なお、保存後の拡張子はどれも「.png」です。
【「PNG-8」「PNG-24」「PNG-32」の違い】
| PNG-8 | PNG-24 | PNG-32 | |
|---|---|---|---|
| 表現可能色数 | 256色 ＋ 透過 | 約1677万色 | 約1677万色 ＋ 透過 (＝約280兆色) |
| 画像ファイルサイズ | PNGの中で一番軽い | PNG-8より大きい | PNG-24より大きい |
| 透過処理 | できる | できない | できる |
| 適している画像 | アイコンなどの単調なイラストや画像 | 単調イラストだけでなく、色彩変化が多い写真や画像 | 単調イラストだけでなく、色彩変化が多い写真やグラデーション画像 |
「PNG」のブラウザの対応状況
以下は2022年2月現在、「PNG」に対応しているブラウザです。
基本的にほぼ全てのブラウザに対応していますが、「PNG」を活用する際は必ず確認しましょう。
【参考｜PNG favicons】
「PNG」の特徴・メリット
ここでは、「PNG」の特徴・メリットについて3点解説します。
可逆圧縮の画像形式
「PNG」は可逆圧縮の画像形式です。
元々の画像データを削除をせずに画像圧縮するため、画像を加工しても画質が劣化しないだけでなく、画像編集後でも原画に戻すことができます。
色数を選択できる
「PNG」には、「PNG-8」「PNG-24」「PNG-32」の3形式があります。
そのため、制作する画像に応じて、色数を選択でき、細かい色彩表現やグラデーション表現が可能です。
| PNG-8 | PNG-24 | PNG-32 | |
|---|---|---|---|
| 表現可能色数 | 256色 ＋ 透過 | 約1677万色 | 約1677万色 ＋ 透過 (＝約280兆色) |
背景透過が可能
「PNG」は、背景透過が可能です。
そのため、背景の不要な部分をカットできます。
また他の画像に背景透過した画像を重ねると、透明部分に画像が差し替わり、グラデーション表現を作ることもできます。
「PNG」のデメリット
ここでは、「PNG」のデメリットについて2点解説します。
ファイル容量が重くなりやすい
「PNG」は、扱える色数が多い画像形式のため、編集した画像のファイル容量が重くなりがちです。
画像のファイル容量が重いとサーバーへのデータ転送量が増えるため、Webページの表示速度が遅くなります。
Webページの表示速度が遅いということは、それだけユーザーにストレスを与えることに繋がり、SEOの観点から見てもマイナス要因となるため、使用には注意が必要です。
なお、別の画像ファイル形式「JPEG」は、PNGよりもファイルサイズを軽量化できるため、大量に画像データを保存したい場合やSEOを優先するのであれば「JPEG」を使用しましょう。
古いブラウザで表示されないことがある
「PNG」は、1996年に開発された比較的新しいタイプの画像形式です。
そのため、あまりにも古すぎるブラウザや定期的なアップデートが行われていないWebサイトでは、表示されない場合があるため、あらかじめ把握しておきましょう。
「PNG」と「JPEG」、「GIF」の違い
「PNG」と似たような画像形式に「JPEG」や「GIF」があります。
似ている画像形式が複数ある場合、どれを使用したら良いか迷いますよね。
ここでは、それぞれの違いについて比較します。
| PNG | JPEG | GIF | |
|---|---|---|---|
| 表現可能色数 | フルカラー（約1677万色） | フルカラー（約1677万色） | 256色まで |
| 圧縮形式 | 可逆 | 非可逆 | 可逆 |
| 透過処理 | ◯ | × | ◯ |
| アニメーション対応 | × | × | ◯ |
| ファイル容量 | ファイルサイズが重くなりやすい | ファイルサイズを小さく調整できる | ファイルサイズが比較的軽い |
| 適している画像 | 文字や図が含まれる画像など修正が複数回要する画像向き | 細かい色彩を表現したい画像・写真向き | アニメーションを用いた動的画像向き |
また、近年では、上記4つの画像形式のメリット(①圧縮率が高い②軽量かつ高品質なアニメーションGIFにも対応可能③背景透過可能④HDRカラーサポートの充実)を集約した次世代型画像フォーマット「AVIF」や画質を保ったまま画像サイズを軽量化できたり、非可逆圧縮なのに背景透過やアニメーションが作れる画像フォーマット「Webp」の使用が流行しています。
気になる方は、以下の記事をご覧ください。
「PNG」ファイルへの変換ツール
ここでは「PNG」ファイルへの変換ツールについて解説します。
「PNG」ファイルへの変換は、Advanced Batch Image ConverterやImage Tunerなどの画像編集ソフトがおすすめです。
Advanced Batch Image Converter
Advanced Batch Image Converterは、多彩なファイル形式(JPEG/GIF/PNG/WebP/BMPなど)に一括変換できる無料画像変換ソフトです。
ただし、画像変換以外の編集や加工は、基本的にできないため、もし画像を編集したい方は、次でご紹介するImage Tunerを使用しましょう。
【Advanced Batch Image Converterを使用するメリット】
・ファイル変換の速度が速い(数秒)
・出力画像の品質/圧縮率を設定する機能やPSNR/SSIMを算出する機能がある
【公式サイト：Advanced Batch Image Converter】
Image Tuner
Image Tunerは、複数の画像ファイルを一括変換できる無料画像変換ソフトです。
フォーマット変換、サイズ変更、名前変更、反転、回転、ウォーターマークの追加などの処理を複数の画像ファイルに対して一括処理を行うことができます。
デメリットとしては、Macユーザーしか使用できないという点です。
そのため、Windowsを使用している方は、Advanced Batch Image Converterを使用しましょう。
【Image Tunerを使用するメリット】
・画像処理エンジンが高速なので、処理速度が速い
・画像だけでなく、テキストの合成も可能
【公式サイト：Image Tuner】
「PNG」で画像を圧縮し、わかりやすい画像制作に励もう！
このページでは「PNG」の概要や特徴、メリット・デメリット、画像変換ツールなどについて解説しました。
「PNG」は、可逆形式の画像フォーマットです。
選択できる色数が多いだけでなく、背景浸透も可能、画像加工しても劣化しないという強みを持っています。そのため、文字や図が含まれるような編集を複数回要する画像制作に適しています。
しかし、鮮明な画像を制作できる分、画像ファイルの容量が重くなりがちです。
できるだけファイルサイズを軽くしたいという方は、別の画像形式(JPEGやGIFなど)をおすすめします。
「画像拡張子」や「SEO」でお悩みの場合は株式会社ipeにご相談ください。株式会社ipeではSEOでの大手クライアント実績多数！SEOを検討する際にはぜひ一度ご相談ください。