●このような画像は色数がだんだんと変化しているため色数が多い。色数を減らすとあるところで突然変化するように見え、違和感がでる。逆に多少の色を変化させてもわからない。たとえば、40 32 20 と色が変化するところを、40 30 20 にしてもほとんどわからない。ここから、jpgの形式が有利である。
●jpgでは圧縮率をあげることでファイルサイズは小さくなるが、画質が落ちてゆく。どのあたりがよいかは画像の特徴と目的による。ほとんどの場合、20%〜25%程度にしておくと間違いない。
●pngで full color ならば画質は完璧だがファイルサイズがインターネットに公開するには大きすぎる。(もちろん目的によりこの画質が必要な場合は仕方がない)256色ではあらが目立ってしまう上ファイルサイズもそう小さいわけでもなく、どう見てもjpgの方が有利である。16色は論外。
●gifもpngの256色と16色と同様。pngより多少大きめになることが多い。
★がおすすめ
種類 | 色数 | 画質 | 部分 | 拡大 | ファイルサイズ |
---|---|---|---|---|---|
jpg | 1% | ○ | 100K | ||
jpg | 20% | ○ | 28K ★ | ||
jpg | 50% | △ | 17K | ||
jpg | 80% | △ | 10K | ||
png | 16 | × | 27K | ||
png | 256 | △ | 67K | ||
png | full | ◎ | 232K | ||
gif | 16 | × | 28K | ||
gif | 256 | △ | 76K |
●このような画像はjpgだと境界線近くにノイズがでる。gifやpngの256色を使うのがよい。もし、色数が少なければ64色とか16色を選ぶとさらにファイルサイズを小さくできることもある。
●色数を減らすときに中間の色を点々と混ぜることで表すことがある。たとえば赤と黄色の点をバラバラにちりばめて橙色を作るような場合である。これが必要な減色をするとファイルサイズがかえって大きくなることもある。
★がおすすめ
種類 | 色数 | 画質 | 部分 | 拡大 | ファイルサイズ (グラフの長さは(1)の例の5倍に拡大) |
---|---|---|---|---|---|
jpg | 1% | ○ | 24K | ||
jpg | 20% | △ | 9K | ||
jpg | 50% | × | 6K | ||
jpg | 80% | × | 4K | ||
png | 16 | ○ | 3K ★ | ||
png | 256 | ○ | 4K ★ | ||
png | full | ○ | 7K | ||
gif | 16 | ○ | 4K | ||
gif | 256 | ○ | 5K |
●(2)で説明した特徴が顕著にでる。このような画像はjpgだと字が汚くなるので、gifやpngを使うのがよい。
●色数を減らすときに中間の色を点々と混ぜる(ディザ)が拡大図から理解できる。
★がおすすめ
種類 | 色数 | 画質 | 部分 | 拡大 | ファイルサイズ (グラフの長さは(1)の例の5倍に拡大) |
---|---|---|---|---|---|
jpg | 1% | ○ | 59K | ||
jpg | 20% | △ | 29K | ||
jpg | 50% | × | 20K | ||
jpg | 80% | × | 13K | ||
png | 16 | × | 5K | ||
png | 256 | ○ | 6K ★ | ||
png | full | ○ | 11K | ||
gif | 16 | × | 9K | ||
gif | 256 | ○ | 11K |
●小さな写真ということで40px×32pxの写真を調べたが、結果からすると大きな写真と大差ない傾向である。状況が変化するにはまだ大きすぎるのだろう。実際には拡大しないと違いがわからない大きさであるから、場合によっては80%のjpgを選択するのもありだと思う。
★がおすすめ
種類 | 色数 | 画質 | 実物 | 拡大 | ファイルサイズ (グラフの長さは(1)の例の50倍に拡大) |
---|---|---|---|---|---|
jpg | 1% | ○ | 1903 | ||
jpg | 20% | ○ | 916 ★ | ||
jpg | 50% | △ | 666 | ||
jpg | 80% | △ | 516 | ||
png | 16 | × | 669 | ||
png | 256 | △ | 2109 | ||
png | full | ◎ | 3347 | ||
gif | 16 | × | 558 | ||
gif | 256 | △ | 2099 |
●原画の色数からjpgを選択することはまずない画像。pngで16色より256色の方がファイルサイズが小さいのがおもしろい。あまり考えずにpng256がいいということか。
★がおすすめ
種類 | 色数 | 画質 | 実物 | 拡大 | ファイルサイズ (グラフの長さは(1)の例の50倍に拡大) |
---|---|---|---|---|---|
jpg | 1% | ○ | 1836 | ||
jpg | 20% | △ | 903 | ||
jpg | 50% | × | 674 | ||
jpg | 80% | × | 514 | ||
png | 16 | ○ | 397 | ||
png | 256 | ○ | 393 ★ | ||
png | full | ○ | 531 | ||
gif | 16 | ○ | 284 ★ | ||
gif | 256 | ○ | 1059 |
●さらに小さく14px×14px小さい画像は色数が限られているのでjpgが不利という状況がよくわかる例。どういうわけかgifが不振。
★がおすすめ
種類 | 色数 | 画質 | 実物 | 拡大 | ファイルサイズ (グラフの長さは(1)の例の100倍に拡大) |
---|---|---|---|---|---|
jpg | 1% | ○ | 673 | ||
jpg | 20% | △ | 502 | ||
jpg | 50% | × | 431 | ||
jpg | 80% | × | 365 | ||
png | 16 | ○ | 231 | ||
png | 256 | ○ | 222 ★ | ||
png | full | ○ | 257 | ||
gif | 16 | ○ | 884 | ||
gif | 256 | ○ | 884 |