何となく画像形式を選んでいませんか?
万能な画像形式「JPEG」
JPEGは、「Joint Photographic Experts Group」という団体が開発した画像形式で、この団体名の略称がそのまま名前として採用されています。
現在でも、デジタルカメラなどで広く採用されている画像形式で、写真などの精密な画像を非常に小さく圧縮することができるため、さまざまな分野で活用されています。
JPEGは、画像の質を極力落とさずにサイズを小さくすることができ、またクオリティーを重視してサイズを犠牲にするか、サイズを小さくしてクオリティーを落とすかなどの調整が細かくできることから、広い分野で活用されています。
それでは、JPEGがそれほどサイズを小さく圧縮できるのはなぜでしょうか。これを理解するには、先に「可逆圧縮」と「不可逆圧縮」の違いについて理解する必要があります。
先ほど例にでてきた「ZIP」や「LZH」といった圧縮形式の場合、専用のツールにかけることで元の状態に戻すことができます。これを「可逆圧縮」といいます。可逆圧縮の場合、情報をあれこれ工夫して短くはしていくものの、情報量を減らすことができないため、そこまで大きな効果を期待することはできません。
しかし、JPEG画像の場合は、不必要な情報やあまり重要ではない情報を捨ててしまって圧縮します。これを「不可逆圧縮」といい、可逆圧縮に比べて飛躍的に圧縮率を高めることができます。
ただし、一度圧縮をしてしまうと、元に戻すことができなくなります。例えば、JPEGに変換したデータは、それを、さらに加工して変換するなどを繰り返すと、画質が劣化してしまうことがあります。そのため、JPEG画像を利用する場合は必ず元のデータ(ネイティブデータ)を保管しておく必要があります。
GIFとJPEG、どちらの画像形式を使うのがベスト?
このように2種類の形式があるWebサイトの画像ですが、どちらの画像形式を使うのが良いのでしょうか。
まず、簡単な分類からすれば250色程度しか扱えないGIFでは、写真を表現するのは不可能です。そのため、写真や人物イラストなどの色数の多いもの、グラデーションを利用しているものなどはJPEGを利用することになるでしょう。GIFは、逆に色数が少なく、単純な図やロゴ、画像文字などに利用します。
しかし、一見するとJPEGだけで事足りてしまうように思われます。色数の多さなどを気にする必要があるGIFに比べて、JPEGはオールマイティーに利用できることから、JPEGだけを使って制作する方もいます。
しかし、GIFもうまく活用すればWebページをより美しく、より容量を小さくすることができます。GIFは、「同じ色の繰り返し」が多く発生する画像では、圧縮率が飛躍的に高まります。JPEG画像の場合は、画像サイズに比例してサイズは大きくなってしまう上、圧縮率を高くしてしまうと、画像内の文字が滲んでしまったり、ぼんやりとしたイメージになってしまうのです。
ロゴやイラスト、画像文字など、くっきりとしたイメージが必要な場合は、GIFの方が優れていると言えるでしょう。
まずは、圧縮したい画像がイラストなのかロゴなのか、色数はどの程度使っているのかで判断をした後、それでも判断ができない場合は両方の形式で圧縮してみて、より容量の小さい方を選ぶと良いでしょう。
Photoshopなどのツールを利用した場合、実際に書き出さなくてもシミュレーションをしながら調整したり、形式を選ぶこともできます。詳しくは次回で紹介します。