デザイナーだったら知っておきたい!画像ファイルの拡張子比較(JPG、 PNG、 GIF、BMP)
この記事は2015年7月15日に公開された記事を再編集したものです。
画像を扱うためにはデータ化する必要があり、様々な画像フォーマットが存在します。
多数の画像フォーマットの中でも、現在一般的に利用されるもの、知られているものといえばJPG、 PNG、 GIF、BMPの4つです。
これらの長所・短所についてしっかりと違いが理解ができているという方は案外少ないのではないでしょうか。
特にデザインを始めたばかりの方は、種類豊富な拡張子を見て何を選んだらいいのか分からないと悩んでしまいがちです。一口にフォーマットとはいっても、最適な使い道であったり対応している色数にも違いがあります。
ですから、用途に応じてどの画像フォーマットを選択すればいいかを知っておくことは、デザインをする際に非常に重要になるのです。
今回はJPG、 PNG、 GIF、BMPの4つの画像フォーマットについて、それぞれの特徴をまとめてみました。
今までなんとなく選んでしまっていた、という方はぜひご確認ください。
画像ファイルの拡張子別の特長
1.JPEG、JPG( ジェイペグ )
Joint Photographic Experts Groupの略です。
デジタル写真用に開発した画像フォーマットで、24ビット(1670万色)のフルカラーをサポートをサポートしています。
デジタルカメラの画像は大半がこの形式です。
サポートする色数が多いので、インターネットのホームページでフルカラーの大きな画像を使いたい時に最適です。
また、グラデーションがかかった画像のように色の変化のある画像にも向いています。
逆に平坦でシンプルな画像だとぼやっとした印象に見えてしまいます。
1/10〜1/50という高い圧縮率で保存することが出来る点が特徴的で、ファイルサイズを極端に小さくすることが可能です。非可逆圧縮方式のフォーマットなので元の画像の品質に戻らないという欠点を持っています。
圧縮すればするほどブロックノイズ、モスキートノイズが現れるようになり、解凍時の画像劣化もしやすくなるので注意が必要です。
とはいえ、普通に使う場合にはさほど気にならない程度の劣化で拡大表示すればぼやっとしたように見えるというレベルです。
画質に気をつけたい場合には、保存時に圧縮率に気をつければ画質劣化を防ぐことができます。気になる場合は、圧縮率を変えて何枚か画像を保存しながら最適な圧縮率を選択するのがオススメです。
JPEGで画像サイズを抑えたい場合には、画像内での色調変化を抑える(急な色変化、明るさの変化を減らす)、画像の面積を狭めると効果的です。
特徴
・非可逆圧縮方式で、圧縮後元の画像品質には戻らない
・透過はできない
・圧縮率の指定が可能
最適な使用用途
・フルカラーの写真
2.GIF( ジフ )
米国大手パソコン通信会社のCompuServeが開発したもので、Graphics Interchange Format の略です。
モノクロ2色から最大8ビット(256色)までサポートしており、圧縮技術に高圧縮が可能な「LZW」を使っています。
これらの特徴によりファイルサイズを小さく抑えることができ、インターネットで流通しやすいことからJPEGと並んで広く使われています。
平坦でベタの多いデザインの画像に使われることが多く、ロゴ、ボタン、アイコンといった色数をあまり使わないホームページの素材、イラストでの使用に最適です。
ファイルサイズを抑えられる反面、サポートしている色が少ないためフルカラーを使っての表現が必要な写真、画質を重要視する画像には不向きなフォーマットといえます。
透過ができるという特徴を持っており、画像の一部もしくはすべてを透明にすることが可能です。ただし、完全な透過・不透明のみが可能でPNGで扱える半透明はサポートしていません。
アニメーション設定ができるのも特徴で、パラパラマンガのような動きを表現することができます。
フラッシュのような滑らかな動きの表現には不向きなものの、ちょっとしたアイコンに動きを付けたりするのにはとても便利です。
特徴
・透過、アニメーション設定ができる
・ファイルサイズが小さい
・使える色が少ない
最適な使用用途
・単色、色数の少ない画像
・イラスト、ボタン、ロゴ
3.PNG( ピング )
GIFに代わるライセンスフリーの画像形式として開発した、W3C(World Wide Web Consortium)推奨の比較的新しいフォーマットです。
Portable Network Graphicの略です。
フルカラーをサポートしており、最大48bit=281,474,976,710,656色(約280兆色)が保有できるもののRGBのみのサポートとなっています。
圧縮率が高めで、例えば同じ画像の場合GIF形式と比較して10%から30%程度ファイルサイズを抑えることが可能です。
可逆圧縮を採用しており、JPEGで見られる圧縮後の画質劣化がありません。
GIFでも可能な完全な透過・不透明に加え半透明を表現することができます。
但し、GIFのようにアニメーションには対応しておらず、フルカラーにした場合JPEGよりもファイルサイズが大きくなってしまうというデメリットがあります。
また、Windows版Internet Explorer4.0以上、Mac版Internet Explorer5.0以上、Netscape Navigator4.04以上のブラウザに対応しており、これらより古いバージョンには対応していません。
最近ではPNG非対応のブラウザのシェアが低くなってきているのでこれからPNGを使ってもさほど問題はありません。
特徴
・完全な透明、不透明、半透明の表現ができる
・フルカラーをサポートしている
・可逆圧縮方式で圧縮後に品質劣化がない
使用用途
・透明色を使った画像
・画質劣化をさせたくない画像
4.BMP( ビットマップ )
Windowsパソコンの標準的なフォーマットです。Microsoft Windows Bitmap Imageの略です。
フルカラーをサポートしています。
RLE圧縮を行うことも可能ですが、通常は無圧縮で画像を保存するため画像の劣化がほとんどないというメリットがある一方、データが大きくなるというデメリットもあります。
同じ解像度の画像の場合だと、先に挙げたJPEG形式データと比較するとファイルサイズが大きくなります。
そのためメール添付、配布には向きません。
GIF、PNGで可能な透過処理はBMPではできません。
サポートはRGBのみでCMYKはサポートしていませんので注意が必要です。
また、ウェブでは扱えないフォーマットです。
特徴
・無圧縮のため画像劣化がほぼ無い
・データが大きい
使用用途
・解像度の高い画像
まとめ
JPG、 PNG、 GIF、BMPの4つの画像フォーマットについてご紹介しました。
いかがでしたでしょうか。
せっかくデザインするなら、当然少しでも美しい仕上がりにしたいものです。
画像フォーマットの特徴を正しく理解出来ていると、綺麗でしかもサイズが軽いデータを作成することができます。
いずれも広く利用されている画像フォーマットですので、違いが今まで分かっていなかった、特に気にしていなかったという方は必ず抑えておきましょう。
このニュースを読んだあなたにおすすめ
コミカルなデザインで活用したいマンガ風フォントまとめ
無料で使えるのがビックリ!Wordpress最新テンプレート10選
【厳選】モバイルフレンドリーに対応した無料Wordpressテンプレート10選
このニュースに関連するカリキュラム
LPOに関するカリキュラム
LPOに関して、カリキュラム形式で学びましょう
- インターネット
- インターネットとは、通信プロトコル(規約、手順)TCP/IPを用いて、全世界のネットワークを相互につなぎ、世界中の無数のコンピュータが接続した巨大なコンピュータネットワークです。インターネットの起源は、米国防総省が始めた分散型コンピュータネットワークの研究プロジェクトARPAnetです。現在、インターネット上で様々なサービスが利用できます。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- ファイルサイズ
- ファイルサイズとは、コンピューターで扱うファイルの容量のことをいいます。 ハードディスクなどにファイルを転送する際などは、この容量をしっかりチェックしておく必要があります。その数値に応じてデータをコンピューターに保存することができます。
- ファイルサイズ
- ファイルサイズとは、コンピューターで扱うファイルの容量のことをいいます。 ハードディスクなどにファイルを転送する際などは、この容量をしっかりチェックしておく必要があります。その数値に応じてデータをコンピューターに保存することができます。
- インターネット
- インターネットとは、通信プロトコル(規約、手順)TCP/IPを用いて、全世界のネットワークを相互につなぎ、世界中の無数のコンピュータが接続した巨大なコンピュータネットワークです。インターネットの起源は、米国防総省が始めた分散型コンピュータネットワークの研究プロジェクトARPAnetです。現在、インターネット上で様々なサービスが利用できます。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- ファイルサイズ
- ファイルサイズとは、コンピューターで扱うファイルの容量のことをいいます。 ハードディスクなどにファイルを転送する際などは、この容量をしっかりチェックしておく必要があります。その数値に応じてデータをコンピューターに保存することができます。
- W3C
- W3Cは、World Wide Web Consortiumの略称で、ダブリュー・スリー・シーと呼ばれています。WWWコンソーシアム、またはワールドワイドウェブコンソーシアムと表記されることが多く、国際的な非営利団体です。主に、WWWと呼ばれるウェブ上で利用される技術の標準化を進めています。
- ファイルサイズ
- ファイルサイズとは、コンピューターで扱うファイルの容量のことをいいます。 ハードディスクなどにファイルを転送する際などは、この容量をしっかりチェックしておく必要があります。その数値に応じてデータをコンピューターに保存することができます。
- ファイルサイズ
- ファイルサイズとは、コンピューターで扱うファイルの容量のことをいいます。 ハードディスクなどにファイルを転送する際などは、この容量をしっかりチェックしておく必要があります。その数値に応じてデータをコンピューターに保存することができます。
- シェア
- シェアとは、インターネット上で自分が見つけて気に入ったホームページやブログ、あるいは、Facebookなど自分自身が会員登録しているSNSで自分以外の友達が投稿した写真、動画、リンクなどのコンテンツを自分の友達にも共有して広めたいという目的をもって、SNSで自分自身の投稿としてコンテンツを引用し、拡散していくことをいいます。
- ファイルサイズ
- ファイルサイズとは、コンピューターで扱うファイルの容量のことをいいます。 ハードディスクなどにファイルを転送する際などは、この容量をしっかりチェックしておく必要があります。その数値に応じてデータをコンピューターに保存することができます。
おすすめ記事
おすすめエントリー
同じカテゴリから記事を探す
カテゴリから記事をさがす
●Webマーケティング手法
- SEO(検索エンジン最適化)
- Web広告・広告効果測定
- SNSマーケティング
- 動画マーケティング
- メールマーケティング
- コンテンツマーケティング
- BtoBマーケティング
- リサーチ・市場調査
- 広報・PR
- アフィリエイト広告・ASP
●ステップ
●ツール・素材
- CMS・サイト制作
- フォーム作成
- LP制作・LPO
- ABテスト・EFO・CRO
- Web接客・チャットボット
- 動画・映像制作
- アクセス解析
- マーケティングオートメーション(MA)
- メールマーケティング
- データ分析・BI
- CRM(顧客管理)
- SFA(商談管理)
- Web会議
- 営業支援
- EC・通販・ネットショップ
- 口コミ分析・ソーシャルリスニング
- フォント
- 素材サイト
●目的・施策
- Google広告
- Facebook広告
- Twitter広告
- Instagram広告
- LINE運用
- LINE広告
- YouTube運用
- YouTube広告
- TikTok広告
- テレビCM
- サイト制作・サイトリニューアル
- LP制作・LPO
- UI
- UX
- オウンドメディア運営
- 記事制作・ライティング
- コピーライティング
- ホワイトペーパー制作
- デザイン
- セミナー・展示会
- 動画・映像制作
- データ分析・BI
- EC・通販・ネットショップ
- 口コミ分析・ソーシャルリスニング