IT・知識 PR

拡張子JPEGとPNGの使い分け イラストにおススメなのは?

ウェブ上やデジタルでの画像利用に欠かせない「JPEG」と「PNG」
両方ともよく使われる画像ファイル形式ですが
その違いを聞かれたときに特徴を説明できるでしょうか

この記事では、JPEGとPNGの違いについて特徴を解説します。

1. JPEG(Joint Photographic Experts Group)ファイル形式


Joint Photographic Experts Group
ジョイント・フォトグラフィック・エキスパート・グループの略

JPEGは写真やイメージを圧縮するためのフォーマットです。
その特徴として写真や微細なグラデーションまで美しく表現可能です。
歴史もあり、軽量でき、汎用的な拡張子です。

JEPGの特徴メリット

  1. 微細なグラデーションまで美しく表現可能!!

    フルカラーの1,677万色を表現できるためグラデーションを
    美しく表現可能です。
    そのため写真や繊細なイラストなどに向いています。

  2. 小さく軽量なファイルサイズに変更できます!!

    ウェブページや写真共有サイトでよく使われる理由の一つが
    小さく軽量なファイルサイズにできて、かつ写真の鮮明さを保てるからです。
    (2015年美しくJEPGのより軽量なHEICという拡張子も出てきました)

  3. 圧縮しても写真の鮮明さをある程度保てる!!

    人体の視覚特性を利用して圧縮しているので
    美しさを保ったまま圧縮できます

  4. 歴史が長く汎用的!!

    国際組織が1980年代後半から使用と規格化を進めて
    1992年に標準規格として定められました(その名残でjpgとJEPGがあります)
    歴史が古く様々な印刷所で対応可能となります


JEPGのデメリット

  1. ロゴやハッキリしたイラストには不向き×

    微細なグラデーションまで表現可能な反面、
    色がはっきりしているロゴやイラストではノイズが出やすくなります

  2. 何度も保存すると画像が劣化してしまう×

    高い圧縮率でファイルサイズを小さくできますが画像の品質も若干低下します。
    また何度も開いて保存して閉じる(数百~数万回)を何度も行うことで少しづつですが劣化していきます。

  3. 透過ができない×

    JEPGを透過することはできません

  4. 一度圧縮した画像は元に戻せない×

    JPEGは不可逆圧縮という
    一度圧縮すると元に戻すことのできない方法で圧縮しています。
    詳しくはこちらの記事をご確認ください。
  5. Zipで圧縮してもあまりサイズが変わらない

    JEPG自体が画像専用の圧縮されている拡張子なので
    さらにZIPを重ね掛けしても変化は少なかったりします

komaworks.fun/jpegの可逆圧縮-vs-pngの非可逆圧縮-とは?

2. PNG(Portable Network Graphics)ファイル形式


Portable Network Graphicsの略
ポータブルネットワークグラフィックスの略

PNGは、透過を使用できたり
高品質の画像を保つことに優れた形式です。
WEB制作などの透過背景やクリアなイメージを重視する場合に最適です。
GIF形式の代替となることを目指して開発されました

PNGのメリット

  1. 1677万色のフルカラーで、透過も可能!!

    JEPGと同じくフルカラーで、透過も可能です。
    ゲームなどデジタルコンテンツとの相性はとても良いです
    しかしファイルサイズが大きいため
    表示速度を重視する通販サイトやLP等には適していません
    (SNSなら、透過を利用した表現もできるので幅が広がります)

  2. 画質の劣化が少ない!!

    PNGは可逆圧縮なので、圧縮率をあげても画質が劣化していくことはなく
    データを完全に復元することも可能です。
  3. ウェブ上でのロゴやフラットイラストに向いている!!

    色数が少ない塗りつぶしの多いイラストや
    ボケない方が好ましいロゴなどにはPNGが向いています
  4. GIFの代替えとして開発!!

    動画要素は組み込めませんが、メタ情報も保存できます。
    最近流行のAI画像がPNGが基本となっていて
    生成時点にプロンプトデータもメタ情報として保存されます。

PNGのデメリット

  1. ファイルサイズが重くなる×

    PNG-32やPNG-24を使えば1677万色のフルカラーで、透過も可能です。
    反面、沢山の色を使った場合画像ファイルサイズが大きいため
    表示速度を重視するようなLPサイトには適していません。
  2. 印刷には不向きです×

    ネットで使われることを目的とした拡張子であるため、
    印刷所によっては、PNG形式に対応していなかったり
    推奨していなかったりすることもあります。

    2024年現在はそんな印刷所はほぼありませんが、
    そのままでは印刷用途として推奨されないことを覚えていると良いと思います。

     
  3. メタ情報の内容は流出する可能性があります

    AI画像では、PNGのままだとメタ情報にあるプロンプトを読み取ることが可能です。
    また、撮影場所や住所など個人情報が含まれる場合もあります。
    販売などを検討する場合、一度JEPGに書き出したほうが安全です。
  4. PNGを軽量化したいときは「減色」を行います×

    圧縮しづらい拡張子のため、
    軽量化したい場合は画像編集ソフトで色数を減らし
    (PNG-8/PNG-24/PNG-32等)見比べて調整します
komaworks.fun/jpegの可逆圧縮-vs-pngの非可逆圧縮-とは?

3. 使い分けのポイント・比較

行動JEPGPNG
印刷したいとき
沢山保存したいとき
軽量化したいとき
【画像】写真や高精細な画像
【画像】背景を透過した画像×
【画像】ロゴやボタンなどの画像
SNSに投稿したいとき

4. まとめ

JPEGとPNGは、汎用的なフォーマットです。
JPEGは写真やリアルな画像に、
PNGは透過やクリアな品質を求められる場面に適しているかと思います。
使い分けることで、ファイルサイズと画質のバランスを保ちながら、
最適な画像を作成できます。

ですが近年様々な拡張子が登場しています。
色々と研究していきますね…!

  • 表示時間を短縮したいなら→WebP
  • macなどの標準で軽量→HEIC
  • ベクターイラスト画像→SVG
  • 動画要素を含められる→GIF

おわりに

JPEGとPNGは、画像ファイルの特性や利用シーンに応じて使い分けることが重要です。それぞれの利点を活かしつつ、最適な画像形式を選択しましょう。

この記事を書いた人
グラフィックデザイナー
こまひかり

デザイン事務所やネットショップ勤務を経て、2020年退社+出産。KOMAWORKS設立。現在、在宅 業務委託+個人事業主。主にデザイン、広告製作を行います。