画像はあなたのウェブサイトを作ったり壊したりする可能性があります。彼らは言葉では伝えられないメッセージを伝えることができます。彼らは気分と雰囲気を作り出し、人々があなたとあなたの会社をどのように認識するかを形作り、そしてウェブ上で他に類を見ない訪問者を引き付けます（多分ビデオを除いて）。
適切な画像は、ビジネスにとって数千ドルの価値がある可能性があります。そして、これがまさに、間違ったものを選択すると、それを知らなくてもお金がかかる可能性がある理由です。正しいものを見つけるために今すぐ時間をかけてください。
JPEGとPNGはどちらもWebサイトで使用できる画像形式ですが、決定を下す前に知っておく必要のある重要な違いがいくつかあります。
JPGファイルとPNGファイルとは何か、さまざまなアプリケーションに最適なファイル、およびそれらを保存してWebサイトに表示する方法を詳しく見てみましょう。
JPGおよびPNGファイルとは何ですか？
JPG
JPGは、Joint Photographic Experts Groupの略で、Web上で最も一般的な画像形式です。これは不可逆形式です。つまり、ファイルが圧縮されるたびに一部の画像データが失われます。ファイルサイズが小さくなり、画像の品質が低下します。
JPGは通常、ファイルサイズが小さいため、Webページ自体に表示される画像に適しています。これは、読み込みが速くなることを意味します。これは、Webサイトの訪問者の関心と関心を維持するために重要です。さらに、JPGは、ほとんどのWebブラウザでサポートされている標準形式です。
JPGは、PNG画像よりも圧縮できるため、必要なスペースと帯域幅が少なくて済みます。最後に、JPGには、コメントや著作権情報などのメタデータを含めることができます。ただし、適切な形式で記述されていない場合、これは削除されます。
JPGを使用することの1つの欠点は、それらが256色に制限されていることです。これはほとんどの画像では問題にならないかもしれませんが、色を省略した情報は0として保存されるため、複数の色合いやグラデーションを持つ複雑な画像では問題が発生する可能性があります。
PNG
PNGファイル形式はロスレスです。つまり、ファイルを圧縮してもデータが失われることはありません。これにより、JPGファイルと比較して大きくなりますが、品質には影響しません。これが2つの形式の主な違いですが、いくつかの小さな違いにより、どちらかがWebサイトに適した選択肢になる可能性があります。
Webサイトの画像にPNGを使用することには、いくつかの利点があります。
JPGよりも高品質です。つまり、高解像度の画面で表示したときに画像の見栄えが良くなります。
PNGには透明効果を含めることができ、Webサイトをより洗練されたプロフェッショナルな外観にします。そのため、Webサイトのロゴまたはヘッダーの一部である画像に適しています。これは、他の要素の色がうまく混ざり合うかどうかを気にせずに、他の要素を画像にオーバーレイする場合に適しています。 PNGはWebブラウザで広くサポートされているため、どのWebサイトにも適しています。
PNGを使用することの欠点は、JPGよりもファイルサイズが大きいことです。また、特定の古いWebブラウザーは、PNGの透明度を十分にサポートしていないか、まったくサポートしていません。つまり、画像の重要な部分である場合は、JPGを使用する必要があります。
ファイルサイズに関しては、PNGは色深度を減らしてファイルを小さくしないため、GIF画像とJPG画像の両方よりも大きくなる可能性があります。これが、PNGが写真やグラデーションを含む画像やその他のマルチカラー画像に適していない理由です。 Webページに複数の画像がある場合は、その形式をサポートする外部プログラムを使用してこれらのPNGを圧縮することを検討する必要があります。そうすることで、画像の品質をあまり損なうことなくファイルサイズを縮小できます。
あなたのウェブサイトで使用するために画像を保存する方法
Webサイトに適切な画像形式を選択したら、それを保存してWebページで使用する必要があります。 JPGファイルとPNGファイルはどちらも、Webで使用するために最適化された形式で保持できます。これは、画質を犠牲にすることなくファイルが圧縮されることを意味します。
多くのオプションが利用可能ですが、最善の策は、OptimillaやTinyPNGなどの無料のオンラインWebベースのアプリを使用することです。あなたのコンピュータの快適さを離れることなくあなたのためにこれをする利用可能ないくつかのプログラムがあります。
Webで使用するために画像を保存するのは難しいプロセスですが、Webサイトで最高の画像を表示するには、画像を正しく保存することが不可欠です。画像を最適化するためのヒントをいくつか紹介します。
- PhotoshopやGIMPなどのプログラムを使用して、画像を正しい形式（JPGまたはPNG）で保存します。
- JPGは一般に、PNGよりもファイルサイズが小さいため、保存するときは低品質の設定を使用してください。
- 画像がウェブサイトに適したサイズと解像度であることを確認してください。
- 圧縮を使用して、品質を犠牲にすることなく画像のファイルサイズを縮小します。
- 覚えておくべきもう1つの重要なことは、元のファイルを保持することです。
将来必要になる可能性があるため、少なくともしばらくの間は常に元の画像を保持してください。
JPGを使用する場合とPNGを使用する場合
ウェブサイトの読み込み速度は、適切な画像ファイル形式によって異なります。そして、JPGとPNGのどちらを使用するかは常に混乱します。
最も一般的なルールは、JPGは、透明な背景やその他のメモリを大量に消費するファイルのない写真に使用されることです。 PNGは、透明度と鮮やかさが重要な背景や画像が透明なグラフィックに使用されます。
JPGは通常、Webページ自体に表示される画像に使用されます。ファイルサイズが小さいため、PNGよりも高速に読み込まれます。
PNGは、品質が高く、透明効果を含めることができるため、Webサイトのロゴまたはヘッダーの一部として使用される画像に適しています。
総括する
JPGとPNGファイル形式の主な違い：
- JPGは通常、PNGよりもファイルサイズが小さいため、Webページ上の画像に適しています。
- PNGは、Webサイトのロゴまたはヘッダーの一部として使用される画像に適しています。
- 画像がウェブサイトに適したサイズと解像度であることを確認してください。
- 圧縮を使用して、品質を犠牲にすることなく画像のファイルサイズを縮小します。
画像ファイルの形式は、Webサイトに表示するコンテンツの種類に完全に依存します。それがより写真的なタイプである場合—JPGに固執してください。グラフィックを主に使用する場合—PNGを選択します。全体として、それはあなたのウェブサイトの速度負荷に影響を与える主な要因の1つであることを忘れないでください。
