Powerd by ipe
テジタルマーケティングで戦略的に
ビジネスを成功させる

画像拡張子一覧!変更方法や違い、種類を紹介!

画像拡張子一覧!変更方法や違い、種類を紹介!
DeepEditor

画像データを表示したり、圧縮したりするファイルの一種に「画像拡張子」がありますが、一体どのようなものなのでしょうか?今回は「画像拡張子」の概要や選び方のポイント、無料画像変換ソフトについて解説します。気になるポイントをここで一挙に確認していきましょう。

「画像拡張子」とは?

「画像拡張子」とは、画像のファイル名、例えば「ファイル名.png」の「.」以降の英数字のことです。

画像拡張子は、画像ファイル形式の種類を判別するために付けられます。
主に英数字3文字で表されることが多いです。

画像ファイル形式の種類

拡張子名 メリット デメリット
JPG ・色数が多い(1677万色対応)
・高画質の画像データを保存できる
・圧縮倍率が指定できる
・容量が軽い
・不可逆圧縮タイプ
(保存を繰り返すと画質が劣化してしまう)
・背景透過ができない
PNG ・色数が多い(1677万色対応)
・JPG以上に高画質で表示できる
・可逆圧縮タイプ
(保存を繰り返しても画質が劣化しない)
・背景透過ができる
・画像の種類によって、容量が大きくなる
・古いブラウザで表示されない場合がある
GIF ・短いgifアニメーションが作れる
・容量が軽い
・可逆圧縮である
・色数が256色以下と少ない
・細かな色の違いを表現できない
・グラデーションの表現に向いていない
SVG ・拡大・縮小しても画質が劣化しない
・後から色やサイズを変更できる
・容量が小さい
・レスポンシブ対応可能
・写真では容量が大きくなる
・SVGコードの知識が必要
・JPGやPNGで保存するとSVGに戻せない
WebP ・拡大・縮小しても画質が劣化しない
・後から色やサイズを変更できる
・容量が小さい
・レスポンシブ対応可能
・写真では容量が大きくなる
・SVGコードの知識が必要
・JPGやPNGで保存するとSVGに戻せない

ここでは、代表的な画像ファイル形式「JPG,PNG,GIF,SVG,WebP」についてそれぞれ解説します。
ファイル形式ごとにメリット・デメリットについてまとめているため、ぜひ参考にしてみてください。

JPG

JPGとは、静止画像データを圧縮する画像ファイル形式です。

正確には「Joint Photographic Experts Group」の略で、JPG形式で保存したファイルの拡張子は「.jpg」になります。

拡張子名 メリット デメリット
JPG ・色数が多い(1677万色対応)
・高画質の画像データを保存できる
・圧縮倍率が指定できる
・容量が軽い
・不可逆圧縮タイプ
(保存を繰り返すと画質が劣化してしまう)
・背景透過ができない

JPGはビットマップ画像であるため、色と色との境目を目立たなくする処理に長けています。
また、圧縮倍率が指定できるため、好みに合わせて画質を微調整できる点も魅力的です。
近年では、主にスマホで撮影された写真の圧縮に用いられています。

PNG

PNGとは、Webサイト上で画像を表示するために開発された画像ファイル形式です。

正確には、「Portable Network Graphics」の略で、PNG形式で保存したファイルの拡張子は「.png」になります。

拡張子名 メリット デメリット
PNG ・色数が多い(1677万色対応)
・JPG以上に高画質で表示できる
・可逆圧縮タイプ
(保存を繰り返しても画質が劣化しない)
・背景透過ができる
・画像の種類によって、容量が大きくなる
・古いブラウザで表示されない場合がある

PNGは、主に輪郭がはっきりした画像やイラスト、文字が含まれる図やグラフなどの圧縮で使用されます。
またグラデーションや色数の多い表現に長けているため、写真を丸く切り抜いて背景を透明にしたい場合や、細かくグラデーションをつけたい場合におすすめの画像ファイル形式です。

GIF

GIFとは、できるだけファイルサイズを小さく抑えたい時に使用したい画像ファイル形式です。

正確には、「Graphics Interchange Format」の略で、GIF形式で保存したファイルの拡張子は「.gif」になります。

拡張子名 メリット デメリット
GIF ・短いgifアニメーションが作れる
・容量が軽い
・可逆圧縮である
・色数が256色以下と少ない
・細かな色の違いを表現できない
・グラデーションの表現に向いていない

GIFは、アイコンや図形など、色数が少なくて済む図形に適しています。

また透過機能があり、指定した色を完全透明にできます。
主にロゴやボタンなど背景が不要な画像によく使用されます。

さらに、GIFは複数の画像を重ねてアニメーションを作ることが可能です。
数秒のアニメーションであれば、動画よりGIFが使われることが多いです。

SVG

SVGとは、XMLで記述する2次元のベクター画像ファイル形式です。
正確には、「Scalable Vector Graphics(スケーラブル・ベクター・グラフィックス)」の略で、SVG形式で保存したファイルの拡張子は「.svg」になります。

拡張子名 メリット デメリット
SVG ・拡大・縮小しても画質が劣化しない
・後から色やサイズを変更できる
・容量が小さい
・レスポンシブ対応可能
・写真では容量が大きくなる
・SVGコードの知識が必要
・JPGやPNGで保存するとSVGに戻せない

SVGは数値データをもとに演算された画像ファイル(ベクター画像)であるため、画像を拡大・縮小しても画質が劣化しません。

そのため、CSSやJavaScriptのアニメーションと相性が良く、動きやぼかしなどのエフェクトを加える事ができます。

WebP

WebPとは、Google社が開発したWeb対応の静止画像を圧縮する画像ファイル形式です。

WebP形式で保存したファイルの拡張子は「.webp」になります。

拡張子名 メリット デメリット
WebP ・画質を保ったまま画像サイズを軽量化できる
・非可逆圧縮なのに背景透過やアニメーションが作れる
・対応しているブラウザが少ない

最大の特徴は、非可逆圧縮にも関わらず、背景透過ができるいう点です。
従来、非可逆圧縮タイプのJPGでは背景透過はできず、また背景透過させる場合は可逆圧縮タイプのPNGを使う必要がありました。

WebPを使えば、JPGとPNGを使い分ける必要はありません。
言うなれば、WebPはJPGとPNGの利点だけを抽出した次世代型画像ファイル形式なのです。

結局どの「画像拡張子」を選択すれば良いの?

「画像拡張子」は基本的にできるだけ画質を落とさず、ファイルサイズを小さくする(圧縮)目的で使用されます。

「画像拡張子」は、「こういうタイプの画像に向いている」「こういう性質がある」などそれぞれ強みは違います。

そこで本記事では、状況別におすすめしたい「画像拡張子」についてまとめてみました。
「画像拡張子」を選択する際は、ぜひ参考にしてみてください。

状況 画像拡張子
ベクター画像で表現したい SVG
・非可逆圧縮と背景透過を行いたい
・圧縮率が高く、ファイルサイズは軽量が良い
WebP
ファイルサイズを気にせず、輪郭がはっきりした画像やイラストにしたい PNG
ファイルサイズを軽くし、圧縮倍率も自分で指定したい JPG
画質は気にしないけど、とにかく軽量サイズが良い GIF

おすすめの無料画像変換ソフト3選

ここでは、代表的な画像ファイル形式「JPG,PNG,GIF,SVG,WebP」へと簡単に変換できる無料画像変換ソフト3選について紹介します。

XnConvert

XnConvertは、複数の画像ファイルをまとめて一括変換できる無料画像変換ソフトです。

XnConvertでは画像のリサイズやトリミングを一括で行うことができます。
またテキストや透かしの追加など多種多様な画像調整機能も備えています。

メリット デメリット
・Webサイト制作の効率化が図れる(画像変換作業の時短)
・MacもWindowsもLinuxなど主要なOSに対応している
・一括変換用途以外には適さない

【公式サイト:XnConvert

Advanced Batch Image Converter

Advanced Batch Image Converterは、多彩式に対応した無料画像変換ソフトです。

Advanced Batch Image Converterでは、一般的に使用される画像ファイル形式のほどんどに一括変換することができます。

メリット デメリット
・一括変換できる画像ファイル形式が豊富(マイナーな画像ファイル形式にも対応)
・出力画像の品質/圧縮率を設定する機能がついている
・出力画像のPSNR/SSIMを算出する機能がついている
・画像変換以外の編集や加工は、基本的にできない。

【公式サイト:Advanced Batch Image Converter

AImage Tuner

Image Tunerは、画像の一括処理をスムーズに行える無料画像変換ソフトです。

Image Tunerには基本的な加工とエフェクト系を合わせて15種類のタスクが用意されています。
また画像のリサイズや回転、反転、透かしの合成、フォーマット変換、EXIF情報の削除など便利な機能が豊富です。

メリット デメリット
・画像変換に関する機能が豊富
・対象ファイルのリストに名前を付けて保存できる
・タスクのインポート/エクスポートが可能
・画像だけでなく、テキストの合成も可能
・画像処理エンジンが高速なので、処理速度が速い
・Macユーザーしか使用できない
(Windowsには対応していない)

【公式サイト:Image Tuner

補足:ビットマップ画像とベクター画像とは?

補足情報として、ビットマップ画像とベクター画像について簡単に解説します。

ビットマップ画像

ビットマップ画像とは、ピクセルの集合体で構成された画像です。
例えば、JPGやGIF、PNGはビットマップ画像に該当します。

ビットマップ画像は、ピクセル1点ごとに細かく色を変化させられるため、細やかな色彩を表現できます。

しかし、色数が多く細やかな色彩を表現すると、ファイルサイズが大きくなるデメリットがあります。

ベクター画像

ベクター画像とは、点と線の情報を数値化して表現する画像です。
例えば、SVGやAdobe Illustratorで制作された画像はベクター画像に該当します。

ベクター画像は、圧縮する際、コンピュータでその都度情報を数値化して表現するため、画像を拡大・縮小しても画質が変化しないという特徴があります。

しかし、輪郭が曖昧な画像を数値化すると、修正に多くの色数を使うため、元のデータ以上にファイルサイズが大きくなるデメリットがあります。

そのため、ベクター画像は単純な図形やイラストの表現には向いていますが、複雑なイラストやグラデーション表現には向いていません。

「画像拡張子」の種類や使用用途を理解し、使いこなそう!

このページでは、「画像拡張子」の概要や選び方のポイント、無料画像変換ソフトについて解説しました。

「画像拡張子」は種類が豊富で、それぞれに強みがあり最適な使用用途は異なります。
どの「画像拡張子」を使用すれば良いか迷っている方は、ぜひこの記事を参考にしてみてください。

SEOの観点からどの「画像拡張子」を使えばいいかわからないという方は、大手クライアント実績多数のipe(アイプ)へご相談ください。

Download
サービス資料ダウンロード(無料)
弊社サービスの概要や料金、
フォロー体制などの詳細はこちらの資料でご確認いただけます。
資料ダウンロードはこちら
Contact
お問い合わせ
デジタルマーケティングについてのご相談や弊社サービスについてのご不明点・
ご質問は、こちらからお気軽にお問い合わせください。
お問い合わせはこちら
お電話でのお問い合わせ 
03-6455-5871 9:00~18:00(平日)