画像を圧縮するならパンダでおなじみの『TinyPNG』、画質を落とさずに容量を小さくしてくれると評判です。
名前に「PNG」とありますが「JPG」ももちろん圧縮できます。
こちらの記事では『TinyPNG』の使い方と、その実力について検証してみたいと思います。
TinyPNG の使い方
1. TinyPNG にアクセスする
無料で利用できますので、ログインは不要です。
2. 圧縮したい画像をドラッグして放り込む
3. 圧縮された画像をダウンロードする
これだけで、63%も圧縮することができました！！
圧縮前後の画質を比べてみよう
では次に、画質の違いがどれだけあるのか、圧縮前、圧縮後を比べてみましょう。
圧縮前の画像は、無料素材サイトからダウンロードしたものを shutterstock さんの『写真のサイズを変更する方法』 を元に、私の使用しているテーマに適切なサイズである 1580px に調整したものです。
関連記事
[clink url=”http://integritydesign.jp/image-processing/”]
では早速、検証開始です！！
圧縮前（516kb）
圧縮後（191kb）
縦だと比べにくいので、横に並べて確認します。（スマホの方はなりません。ごめんなさい…）
圧縮前（516kb）
圧縮後（191kb）
ほとんど変わりませんよね？
ちなみに、圧縮したものを再度圧縮してみましたが、６％しか減りませんでした
では次に、Photoshop の『Web用に保存』の機能を使って、TinyPNG で圧縮したものと同程度の容量になったものとを比べてみましょう。
TinyPNG で圧縮（191kb）
Photoshop で圧縮（190kb）
ほぼ変わらなくないですか？
画像を変えて、もう一度画質を比べてみよう
今度はちょっと違った雰囲気の画像で比べてみましょう。
こちらの画像は無料素材サイトからダウンロードしたものを、Photoshop で色調だけ補正、JPEG の最高画質で保存したものです。
圧縮前（810kb）
これを、まずは『TinyPNG』で圧縮してみます。
圧縮後（244kb）
比べにくいので、横に並べてみましょう。
圧縮前（810kb）
圧縮後（244kb）
パンダの画像と同様、肉眼ではあまり差は感じられませんよね？
では次に、Photoshop の『Web用に保存』の機能を使って圧縮してみます。
ちなみに、Photoshop の画質は
[su_note note_color=”#f7fafa”]
- 低画質
- 中画質
- やや高画質
- 高画質
- 最高画質
[/su_note]
の５段階に分かれています。
『やや高画質』で保存（210kb）
一段階画質を落として『中画質』で保存（103kb）
拡大しないと分からないレベルですが、『中画質』まで画質を落とすと、黄色い壁やGジャンの際のノイズが気になり始めます・・・
偶然かもしれませんが、ノイズが発生する一歩手前の Photoshop の『やや高画質』と同じレベルに圧縮してくれた『TinyPNG』、すごいかもしれません！！
では、最後に『TinyPNG』で圧縮したものと、Photoshop で同程度の容量になった『やや高画質』に保存したものとで画質を比べてみましょう。
TinyPNG で圧縮（244kb）
Photoshop で圧縮（210kb）
ほとんど差は感じられないですよね？
まとめ
２枚の画像を使って、『TinyPNG』と『Photoshop』で圧縮し、その画質の差を検証してみました。
偶然かもしれませんが、『TinyPNG』はノイズが発生する一歩手前のところで圧縮してくれる優れたツールであることが分かりました。
無料のツールでここまでできてしまうなんて、すごいですよね。
ちなみに『TinyPNG』には、記事を投稿すると自動で圧縮してくれるプラグインバージョンもあるのですが、今回ご紹介した一つ一つ手動でできるブラウザ版の方が私は気に入って使っています。
あなたもぜひ、試してみてくださいね。