12
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

はじめてのアドベントカレンダーAdvent Calendar 2024

Day 11

[番外編 #8] 「jpeg」と「png」どちらにしましょうか

Posted at

はじめに

:desktop: 皆様お疲れ様です。今回は 「画像の保存形式」 について見ていきたいと思います。その中でも 「jpeg」「ping」 について見ていきます。どちらも画像を圧縮して保存するファイル形式ですが、適切な用途がそれぞれあります。

「JPEG」「PNG」は拡張子の1つ

拡張子とは、ファイルの種類を識別するための文字列。ファイル名と拡張子を「.(ドット)」で区切ります。(イメージは👇の図です)
スクリーンショット 2024-12-09 234108.png
:rolling_eyes: 画像ファイルだと他に「.GIF」もありますよね動画じゃないけど動きのあるもの

ファイルを開くためには、拡張子によっては専用のアプリケーションが必要です。例えばWordは「.doc」、Excelは「.xsx」「.xlsx」「.csv」などで開きます

ファイルデータは拡張子によって作成したアプリケーションを判断しています。安易に変更してしまうと、データが開けなかったり、破損する可能性が高まります

JPEG形式

「.jpeg」は 「Joint Photographic Experts Group(JPEG)」 であり、デジタル写真の最も一般的な保存方法の一つでです。JPEGは、圧縮プロセスより、画像ファイルのサイズが大幅に削減されるため、webページでの保存と読み込みが容易になります。(最大約1600万色を使用できます)

:pencil2: フルカラーに対応しているので色数が多い画像やイラストに適しています

PNG形式

「.png」は 「Portable Network Graphics(PNG)」 であり、圧縮可能です。JPEGと同様に約1600万色に対応しています。高品質の写真ではなく、主にwebのグラフィック、イラストなどに使用されます。これはJPEGよりも多くの保存スペースを使用するためです。そして画像透過、透明な背景のグラフィックを処理する機能があります。

:pencil2: 色数が少ない画像にはPNGが適しています(色と色との境目までハッキリと表現でき、粗が少なく綺麗に仕上げられるからです)

JPEGとPNGの違い①「可逆と非可逆」

JPEGは 「非可逆圧縮」、PNGは 「可逆圧縮」 です。画像データは一般的にサイズが大きく、データ圧縮は非常に重要な技術となります。

「可逆圧縮」再び元の画像に復元ができ「非可逆圧縮」完全な復元はできません。(画質の劣化が生じるためです)

JPEGとPNGの違い②「ファイルのサイズ」

PNGは、可逆圧縮のためにファイルのサイズがJPEGよりも大きくなります。(多くの情報が保持されているからです) 通常、JPEGやGIFよりもサイズが大きくより多くのストレージスペースを使用します。

まとめ

それぞれの違いをまとめてみました

JPEG PNG
画像の透過 ×
圧縮方式 非可逆圧縮 可逆圧縮
容量 軽い 重い
主な用途 フルカラーの写真やカメラ写真など Webサイトの写真、ロゴ、イラストなど

画像の綺麗さは、ユーザーに与える印象も左右してしまいます。JPEGとPNGの違いを理解して最適な方を使うことが大事と理解できました。
最後まで読んで頂きありがとうございました!

参考元

過去の番外編はこちら

12
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?