画像をWebサイトやブログ、資料などで使っていると、「画像の容量が大きすぎる」「アップロードできない」「ページの表示が重い」といったことがあります。
画像のファイル容量を小さくする方法は、大きく分けると「画像を圧縮する」「画像サイズを小さくする」「画像形式を見直す」の3つです。
ただし、容量だけを優先して処理すると、画像が必要以上に粗くなってしまうこともあります。
ここでは、JPG・PNG・WebP画像の容量を小さくするときに知っておきたい基本と、画質を落としすぎずに軽量化する方法を紹介します。
画像の「サイズ」と「容量」は違う
画像を小さくするときに、まず区別しておきたいのが「画像サイズ」と「ファイル容量」です。
画像サイズは、たとえば「1920×1080px」のような横幅と高さを指します。
一方、ファイル容量は「500KB」「2MB」のように、その画像ファイルがどれくらいのデータ量を持っているかを表します。
同じ1920×1080pxの画像でも、画像形式や圧縮状態によってファイル容量は大きく異なります。
そのため、
「画像の見た目の大きさを変えたい」のか、
「横幅や高さはそのままで容量だけ小さくしたい」のか、
によって使う方法も変わります。
方法1：画像を圧縮する
画像の横幅や高さを変えずにファイル容量を小さくしたい場合は、画像を圧縮します。
JPGやWebPでは、保存時の品質を調整することで容量を小さくできます。
品質を高くすると元画像に近い見た目を保ちやすい一方、ファイル容量は大きくなります。反対に品質を下げると容量は小さくなりやすくなりますが、圧縮を強くしすぎると細部の劣化が目立つことがあります。
そのため、最初から極端に強く圧縮するのではなく、画質と容量のバランスを見ながら調整するのがおすすめです。
デジタル作業室では、JPG・PNG・WebPに対応した画像圧縮ツールを利用できます。
「軽く圧縮」「標準」「強く圧縮」から選択でき、圧縮前と圧縮後の容量、削減率を確認してから保存できます。
→ 画像圧縮ツール
方法2：画像の横幅・高さを小さくする
元画像のピクセル数が必要以上に大きい場合は、画像をリサイズする方法もあります。
たとえば、Webページ上では横幅800px程度でしか表示しない画像を、4000pxのまま使用する必要がないケースがあります。
この場合は、実際に必要な大きさまで画像を縮小することで、ファイル容量も小さくなることがあります。
画像の横幅や高さを変更する場合は、画像リサイズツールを利用できます。
圧縮とリサイズはどちらを使えばいい？
圧縮とリサイズは、どちらもファイル容量を小さくするために使えますが、目的が異なります。
画像の横幅・高さを変えたくない場合
画像圧縮を使います。
画像そのものが必要以上に大きい場合
画像リサイズを使います。
Webサイトなどで使う画像では、必要に応じてリサイズしたうえで圧縮すると、容量をさらに抑えられる場合があります。
ただし、小さくしすぎたり、何度も強い圧縮を繰り返したりすると画質が低下することがあります。できれば元画像を残したまま、用途に合わせた画像を別に作成すると扱いやすくなります。
方法3：画像形式を見直す
画像のファイル容量は、JPG・PNG・WebPなどの形式によっても変わります。
JPG
写真のように色数の多い画像に向いています。
圧縮率を調整できるため、写真の容量を小さくしたい場合によく利用されます。
一方、透明な背景には対応していません。
PNG
透明な背景を使えるほか、図や文字、スクリーンショットなどにも利用されます。
画像の内容によってはJPGやWebPよりファイル容量が大きくなることがあります。
WebP
写真にも透明画像にも対応できるWeb向けの画像形式です。
画像によっては、JPGやPNGより容量を抑えながら使用できる場合があります。
JPG・PNG・WebPの特徴については、「JPG・PNG・WebPの違いは？画像形式の特徴と使い分け」で詳しく紹介しています。
JPG画像を軽くするときのポイント
JPGは品質を下げるほど容量を小さくしやすくなりますが、圧縮を強くしすぎると、輪郭や細かな模様などが崩れて見えることがあります。
写真を軽量化するときは、
- まず標準的な圧縮で試す
- 容量とプレビューを確認する
- まだ容量が大きければ圧縮を少し強くする
という順番で調整すると、必要以上に画質を落としにくくなります。
もともと十分に圧縮されているJPGの場合は、再度圧縮しても容量がそれほど小さくならないこともあります。
PNG画像を軽くするときのポイント
PNGはJPGとは圧縮の仕組みが異なるため、同じように品質を下げれば必ず大幅に軽くなるわけではありません。
特に透明部分が必要な画像では、容量だけを理由にJPGへ変更すると透明部分が失われます。
PNG画像の容量が大きい場合は、
- 必要以上に画像サイズが大きくないか確認する
- 透明部分が本当に必要か確認する
- 用途によってWebPなど別の形式も検討する
といった方法があります。
ただし、形式を変更すると画像の性質も変わるため、単純に「一番容量が小さい形式」を選べばよいわけではありません。
WebP画像を軽くするときのポイント
WebPは圧縮率と画質のバランスを調整でき、透明な背景にも対応しています。
Webサイトで使う画像では選択肢になりやすい形式ですが、こちらも強く圧縮すれば画質が変化します。
JPGと同じように、まずは標準的な設定から試し、プレビューを確認しながら容量を調整するとよいでしょう。
画像を何度も圧縮しない
JPGやWebPなどの画像を何度も保存し直して圧縮すると、そのたびに画質が変化する場合があります。
そのため、
元画像
↓
用途に合わせてリサイズ
↓
必要な圧縮
↓
完成画像
という形で、できるだけ元画像から一度で作る方が扱いやすくなります。
加工前の元画像も残しておくと、あとから別のサイズや圧縮率で作り直せます。
ファイル容量は小さければ小さいほどよいわけではない
画像の容量を小さくすることは、Webページの軽量化やファイル共有などで役立ちます。
一方で、容量だけを優先して画質を極端に落とす必要はありません。
大切なのは、用途に必要な画質を保ちながら、不要なデータ量を減らすことです。
まずは画像サイズが用途に合っているかを確認し、そのうえで適度な圧縮を行うとよいでしょう。
画像の容量をすぐ小さくしたい場合
画像の横幅・高さを変えずに容量を小さくしたい場合は、デジタル作業室の画像圧縮ツールを利用できます。
JPG・PNG・WebPに対応し、圧縮前後の容量や削減率を確認してから画像を保存できます。
画像はサーバーへアップロードせず、お使いのブラウザ内で処理します。
