PNGで対照実験:どうやったら全体の容量を落とせるか

ちょっと試験があったので更新の間が空いてしまいました。
なんとかウディフェスには間に合いそうです。

さて、Webでも広く使われるようになってきた画像形式、PNGですが、
例えば顔グラフィックや立ち絵など、同じ色を使いまわすようなものは
バラバラで保存するより繋げて保存した方が全体として容量が減ります。

問題は、縦に繋げるか、横に繋げるか

ちょっと対照実験してみました。
コレが基準にする画像です。
(100px*100px, 100色, 1.05kb)
100_100_256_h.png


・色数
無論のことですがPNGは色数が少ない方が容量が少なくなります
(100px*100px, 16色, 708b)
100_100_16_h.png

・色の繋がる向き
GIF画像では水平方向に同色が連続しているほど圧縮される仕組みなんですが、
PNGはそこんとこどうなんでしょう。
(100px*100px, 100色, 1.01kb)
100_100_256_v.png
ありゃ、最初より軽いですね

(100px*100px, 100色, 1.18kb)
11.02.18. 100色に減色したものに差し替えました
100_100_256_c.png
ナナメにするとやっぱり重くなりました。
水平か垂直がいい感じですね。


・大きさ
ここが本題です。
縦に拡大するのと横に拡大するのとどちらがファイルサイズが小さくなるか。

(200px*100px, 100色, 1.07kb)
200_100_256_h.png
面積は二倍なのに最初のとほぼ容量変わりません。わお。

(100px*200px, 100色, 1.93kb)
100_200_256_h_1.png

(100px*200px, 100色, 1.88kb)
100_200_256_h_2.png

やっぱり縦長の方が重いです。

ウディタで戦闘アニメなどの繋がった画像を作る場合は、
横長の方がいいという結論になります。




追記1
色数が間違ってたので修正しました。100pxでグラデしてるので100色ですね。

追記2
今回の画像はすべてPhotoshop Elements2.0、「ディザなし」、インタレースなしで作りました。
Twitterでご指摘を頂きましたが、例えばEDGEを使って今回の5番目の画像を90度回転させると1.02kbになります。
つまり、縦長の方が軽くなる場合があります

追記3
色数を修正したのはいいんですが、ナナメのを100色に直すのを忘れていたので差し替えました。
45度で傾いていてもそれなりに軽くなるようです
ただ、下のようにちょっと半端な角度のグラデだと重くなります。
(100px*100px, 100色, 1.91kb)
100_100_100_c2.png

関連記事
スポンサーサイト

Comment

Comment Form
公開設定

Trackback


→ この記事にトラックバックする(FC2ブログユーザー)
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。