0364352835
メールでお問合せ

代表的な画像ファイルの形式とそれぞれの特徴

2020年12月22日(火)メルマガサービス

今週は、CMSpro制作担当の沖野が担当させていただきます。

代表的な画像ファイルの形式とそれぞれの特徴
制作担当: 沖野直人

今回は、いくつかある画像ファイルの形式とそれぞれの特徴をご紹介していきたいと思います。

みなさんは、撮影されたお写真をパソコンへ保存するときにどのような形式で保存されてますか?
大半の方が形式といっても、あまり気にしたことがないのではないでしょうか?

ホームページを作る際に使う形式は主に、【JPEG・PNG・GIF】の3つの形式を使用します。
以下では、それぞれの形式の基本的な内容と特徴をまとめました。

JPEG形式の基礎

JPEGとは、今回ご紹介する3つの形式の中でも最も、代表的な形式です。
正式名称は、Joint Photographic Experts Groupといい、規格を制定した組織の略称が名称に使用されており、約1,677万色もの画像を扱えるため、スマホやデジカメ写真の記録用に使用されているケースが多い形式です。

JPEG形式の特徴

・拡張子が複数ある

JPEG形式には、「.jpg」や「.jpeg」などの他に「pjpeg」「jpe」「pjp」「jfif」などの様々な拡張子がありますが、すべて同じものなので、違いは特にありません。
大抵の場合は、「.jpg」や「.jpeg」を使っておけば全く問題ありません。

その中でもその昔、拡張子の文字数が3文字までという制限があったため、
「.jpg」を一般的に使用することが多いように思います。

・上書き保存すると劣化するケースがある

JPEGは不可逆圧縮を行う影響上、画質が劣化してしまうのがデメリットの一つです。
※不可逆圧縮とは、1回圧縮すると元のデータ通りに戻せない仕組み

JPEGでは、画像を8×8ドット区切りのブロックとして近い色に置き換えて表示させていますが、
圧縮した際に、データを切り捨てているため、それゆえに完全に元の状態に戻すことができません。

ただ、劣化するといっても1回や2回の圧縮の場合は、人間の目で確認ができないぐらいの劣化なので、そこまで神経質になる必要はありません。

PNG形式の基礎

PNG形式とは、Portable Network Graphicsといい、Webで画像を扱うファイルフォーマットとして、1996年に登場した比較的新しいファイル形式です。

8bitと24bitのどちらで保存するかを選択でき、
8bitの場合は256色でのグラフィックスに適した保存ができます。
24bitでは、約1,677万色の写真が保存でき、さらに透過色をもたせることができます。

ただし、上記のとおり新しい形式のため、古いPCやブラウザをはじめ、
携帯電話ではPNGに未対応の場合もあるため、画像データが表示されないことが問題点としてあります。

PNG形式の特徴

圧縮してもデータを完全に復元できる

先程の、JPEGとは異なり、PNG形式は圧縮してもデータを完全に復元できる可逆性圧縮という特性をもっています。

ただし、その分、不可逆圧縮とは違い、容量が数倍程度大きくなってしまうのが欠点の一つとも言えるでしょう。

透過処理をもたせることができる

透過処理とは、指定色に対して透過情報を加えることができる機能で具体的には、背景を透明にすることが可能です。
WEBの場合は、ロゴの箇所に使用するケースが多い形式です。

GIF形式は、Graphics Interchange Formatといい、
容量を可能なかぎり減らしつつ、Webページによる表示もできるように開発された画像形式です。

使用の場合は特許料が一時期に要求されたことがあるため、それを境にしてPNG形式が生まれたことによって、使用が激減した経緯があります。

GIF形式の特徴

アニメーションで動く画像が実現できる

GIF形式の最大のメリットといえば、GIFファイル内に
複数の画像を挿入することで、パラパラ漫画のような動きを実現させることができます。
ただ、色数が256色までと少ないため、簡易的なアニメーションとなります。
簡単なイラストを簡易的に動かしたいという要望の場合は、GIF形式が最適だといえます。

データ容量が小さい

GIF形式の場合は、オリジナルの圧縮方法をつかっているのと、上記でご紹介したとおり色数が256色までという制限があるため、比較的データ容量が小さく負荷が少なく表示させることができます。

いかがでしたでしょうか?

普段あまり意識することが少ない画像形式ですが、大きくわけて【JPEG・PNG・GIF】の3つの形式があります。
基本的には、
「写真=JPEG形式、イラスト=GIFまたはPNG形式」とおぼえておけば問題ないかと思います。

その中でもそれぞれ、一長一短はありますので、目的に応じて色々と試行錯誤して試してみるのもいいかもしれません。

最後までお読みいただき、ありがとうございました。

– 沖野直人

関連記事

  • 「LINE公式アカウント」は無料でどこまで使えるのか? いつもご覧頂き、誠にありがとうございます。 今週は、CMSproの池田が担当させていただきます。 現在、メールや電話よりも連絡手段として使われることが多い【LINE】。 近年は個人間でのやりとりだけでなく、企業・店舗と 個人のお客様とのやりとりで【LINE公式アカウント】が活用されてい […]
  • 「3つのNOT」を突破して集客に繋がる文章を作る! こんにちは! 今回はカスタマーサクセスチームの釜がお届けします! 週末は主に草野球に勤しんでおりますが、 2021年シーズンに入りここまで打率.461と絶好調が続いております! 昨年2020シーズンは序盤から重度のスランプに陥り、フォームを変えたり肉体改造に励んだり(早々に断念)と […]
  • アナリティクスで最低限確認しておくべきポイント いつもCMSpro週刊メルマガをご覧いただき、誠にありがとうございます。 今週は、CMSproの高橋が担当させていただきます。 Webサイトに関するお役立ち情報を ブログ形式で分かりやすくお届けしています。 本日のテーマは **************************** […]
  • 成功するウェブサービス3つのポイント ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ┃CMSproのメルマガでしか言えない話┃【 CMSpro公式メルマガ】 […]
  • JPEGやWordやExcelも!一発かんたんPDF作成/変換無料ツール いつも週刊メルマガをご覧頂き、誠にありがとうございます。 […]
  • サポート担当が注意が必要だと思うご依頼 おはようございます、リンヤ株式会社の細川です。 いつもCMSpro(シーエムエスプロ)週刊メルマガをご覧いただき、誠にありがとうございます。 今週は、気温が高いので都内の桜の開花もそろそろだなという時期になりました。 花粉症の方には辛い季節ですが、今週~来週末あたりは お花見が […]

東京都港区芝浦3-14-8芝浦ワンハンドレッドビル2F運営:リンヤ株式会社
© 2022 CMSpro All Rights Reserved.