画像の拡張子【JPG・PNG・GIF 】それぞれの特徴とは？

画像を表示するだけなのに、データ上の拡張子っていろんな種類がありますよね！
こちらの記事では、その中でも使われる頻度の多いメジャーな拡張子について解説して参ります！

JPG

「jpg」とは、汎用性が高く 繊細な色表現が得意 な拡張子です！

パソコンやスマホを使う上で、最もポピュラー な画像拡張子といえば、「jpg」データ。
読み方は「ジェイペグ」で、「Joint Photographic Experts Group」の略。
スマホで撮影した写真やwebサイト上の画像データなど、私達の生活にいつの間にか溶け込んでいる身近な拡張子です！
( 時々「jpeg」と表示されている事もありますが、同じ拡張子です。)

ほとんどのソフトやアプリに対応している ので、
誰でも 気軽に編集できたり気軽に共有できたりと、非常に 利便性の高い データです！

「jpg」で再現できる色数は 約1670万色 ！
色数が非常に多いので、写真や繊細なイラスト の表現を得意としています。

jpgデータとして書き出す時はデータをどのくらい圧縮するか決められるので、
「見た目のクオリティーを維持しつつ、データだけ軽くしたい！」という方には打って付けです！

ただ、編集や共有が簡単なjpgですが、
加工や編集をして 上書き保存 を繰り返すと 画質が劣化していく という少し残念な性質を持っています。
しかも、一度劣化したデータは加工前の 綺麗な状態に戻す事ができません。( これを「非可逆圧縮」といいます。)
jpg画像を何度も加工する時は、編集前のオリジナルデータを複製して残しておきましょう！

また、色数が多く、色と色の間を補って滑らかに表現してくれる「jpg」は、輪郭のくっきりハッキリとした画像 を表示するのが 苦手 です。
境界線がぼんやりとした印象になってしまうので、ロゴやアイコンに使用するのはやめておくのが良いかもしれません。

さらにさらに、jpgデータは必要な色以外を透明にする事 (「透過」と言います ) が できません。
webデザインの丸いアイコンやスマホアプリの人型シルエットなど、四角形以外で見かける画像はjpg以外の拡張子です。
用意した画像を背景の上に配置したい場合は、あらかじめ透過できる拡張子で書き出しておきましょう！

PNG

「png」とは、背景を透明にできて、データが劣化しない 拡張子です！

webサイトやアプリなど、「jpg」に次いで身近な拡張子が「png」データ。
読み方は「ピング」で、「Portable Network Graphics」の略。

「jpg」とは違い、必要な部分以外 を全て 透明に する事ができる拡張子です！
ソフトを上手に使えば、向こうがぼんやりと透けて見える状態でも保存可能。

しかも加工後に保存をしても劣化しない「可逆圧縮」なので、劣化を気にせず画像を何度でも調整できます！

再現できる色数は「約1670万色」とjpgと同じなので、見た目の美しさは抜群！

ただ、
「透過もできるし、劣化もしないし、色数も多いし、とりあえず全部pngで保存しておけばいいよねー！」
と思ってなんでもかんでもpngにしてしまうと、便利な分データが非常に重いので大変です！

「透過」や「可逆圧縮」の機能が必要じゃなくてもpng形式をオススメするのは、色数の少ないくっきりとした画像の時。
画像の内容によっては、jpgよりもpngの方が軽くなる事も！

・「透過」や「可逆圧縮」が必要　→　png
・「透過」や「可逆圧縮」が不要　→　色数が少ない　→png
　　　　　　　　　　　　　　　　 →　色数が多い　→jpg

など、書き出し方法に選択肢がある時は一考してみてくださいね！

GIF

「gif」とは、簡単なアニメーション が作れて データが非常に軽い 拡張子です！

「gif」は表現できる色数が少ないですが、その分データが非常に軽い拡張子です！
読み方は「ジフ」で、「Graphics Interchange Format」の略。

私達の身の回りの画像データとしてポピュラーなものは「jpg・png・gif」の三つかと思いますが、「gif」はその中でも唯一、動画として保存可能な拡張子！
データが非常に軽い ので、ネットの通信容量の負担を大幅に軽減してくれています！
動画を見るための特殊なソフトも必要なく、アクセスしたら 自動的に動画を繰り返して再生 してくれるので、web広告としても引っ張りだこ。
YouTubeで見かけるような本格的な動画には向きませんが、小さくてシンプルな構成の物にはオススメです！

「png」データ同様に 透過 機能も使えて、しかも 可逆圧縮 なので劣化しません！

しかしながら、「gif」で表現できる 色数は256色。
jpgやpngの1670万色と比べると、あまりにも少ないですね。色数のたくさん使われた写真やイラストなどは綺麗に表示できません。
動画でしかも色数まで多いとなると容量が非常〜に重くなるので、軽量化のためには仕方ないのかもしれません。

「gif」としての書き出しを予定している時は、データ作成の段階であらかじめ色数を少なくしておきましょう！

「gif」を書き出す時は
「256色」「128色」「64色」「32色」「16色」「8色」「4色」「2色」など色数を選ぶ事もできるので、ロゴやアイコンなど色数が元々少ない画像の時、ネット回線が必要な媒体の時は活用してみましょう！

JPG・PNG・GIFの機能比較