JPGの書き出し品質とファイルサイズの関係

執筆日時：2011/05/26

　JPGは非常に効率的な画像の圧縮を行うのでファイルサイズの小さい画像を作るのに適したフォーマットですが、不可逆圧縮を行うので画像の品質が低下します。そのため用途に合わせて品質を調整して書き出すのが望ましいでしょう。今回はWEBサイトを製作する上で掲載することが多いであろうスクリーンショット画像を、5%刻みで品質の設定を変えてJPG画像に書き出し、ファイルサイズと実際の品質を比較します。

　右が今回使用するスクリーンショット画像です。もともと1680*1050pxのPNG画像であったものを、WEBサイトへの掲載という目的を考慮してImageMagic(6.5.7-8)を用いて720*450pxに縮小したPNG画像にし、それをさらに品質を変えつつJPG画像に変換していくという作業を行いました。

　なお、ImageMagicでJPGの品質を指定して変換する場合は"-quality"オプションを付けて指定します。screenshot.pngを品質85のJPG、screenshot_085.jpgに変換するには

# convert -format jpg -quality 85 screenshot.png screenshot_085.jpg

とします。

　右はPNG画像で可逆圧縮しか行っていないのでサイズを縮小しているとはいえ、くっきりとした画像で見出しの文字もはっきり読めます。

ファイルサイズの結果

　結果は右のグラフのようになりました。細かい数値は以下の表で確認してください(%の欄は多くのアプリケーションでデフォルトの品質となっている85を100としています)。表の一番右側ではpngcrush(1.7.0)で-brute -reduceオプションを指定して圧縮したPNG画像のファイルサイズも載せています。

quality	byte	%
5	7132	10.55
10	12568	18.58
15	16909	25.00
20	20760	30.70
25	24141	35.69
30	27030	39.97
35	29775	44.02
40	32058	47.40
45	34594	51.15
50	36856	54.49
55	39114	57.83
60	41830	61.85
65	45017	66.56
70	48915	72.32
75	53277	78.77
80	59443	87.89
85	67633	100.00
90	101839	150.58
95	142062	210.05
100	272504	402.92
pngcrush	239773	354.52

　これを見ると、今回使用した画像の場合、品質が90%を越えるとぐっとファイルサイズも増大していることが分かります。しかも品質100%ではPNGで目一杯圧縮をかけたときよりファイルサイズが大きくなっています。

イメージの品質

　では次に実際に書き出された画像の質を見てみましょう。いくらファイルサイズが小さくても、画像として情報を伝達するに足りない質では話になりません。なお、画像の形式がすべてPNGになっていますが、それぞれのJPG画像ををロスレスでPNG画像に変換しているので、問題はありません。

↑最初は品質5の画像ですが、これはサイトロゴすら読めたものではありません。広告で使われている男性の写真も顔の色が完全に失われています。

↑次は品質20の画像です。だいぶマシになりましたが、記事のタイトルなどの割と大きな文字でも読みにくいです。全体的にブロックノイズが目立つのでこれも実際にWEBサイトで使用するには質が悪すぎます。

↑そしてまた飛んで品質50の画像です。記事のタイトルはちゃんと読めるようになり、広告の色合もそれなりに再現されるようになっています。用途によってはこれくらいの品質でも構わないかもしれませんが、見ると質の悪さを感じる状態です。

↑ここからは細かく行きます。品質70です。だいぶ綺麗になってきました。ヘッダーメニューの文字も読めます。

↑品質75。もう毎回コメントを付けることはしません。自らの目で確かめてください。

↑品質80

↑品質85

↑品質90。この辺りからブロックノイズが分からなくなってきます。

↑品質95

↑品質100

まとめ

　やはり多くのアプリケーションでデフォルトとなっている書き出し品質80～90というのは妥当だということが分かりました。品質が80ぐらいになると、今回のように文字を含んだスクリーンショット画像でも圧縮が気にならないほどの品質になります。それでもPNGに比べればファイルサイズが3～4分の1になるので、WEBサイトに掲載する画像としては非常に適しています。しかし用途によっては品質50～60くらいの画像でも十分使い物になるかもしれません。こればっかりは画像に何が描かれているかと用途により異なるので何とも言えませんが。あと忘れてはいけないのは、JPGで品質を上げて保存するくらいならPNGで最大限可逆圧縮する方がファイルサイズが小さくなる場合もあるということです。