載せる画像の保存形式を比較[png-24, jpg-60, PNG Hat, PNGoo]

|

ブログだなんだで画像を扱うとき、その保存形式はちょっと気になっています。
昔は「写真などはjpgでベタ塗りのテキストなんかはgif」とも言われてましたが、今はpngを使う人も多いです。
png形式はキレイで、さらに透過も対応しているので大変都合いいのですが、少し容量が大きくなってしまいます。サーバに置くサイズ的には余裕なのですが、それを読み込む人の転送量が増えて、表示に時間がかかってしまっては困ります。

そんなわけで、1,2カ月前に意を決して「PNG Hat」というPhotoshopのプラグインを購入しました。
ここで紹介されてるのがわかりやすいです。

PNG画像をより美しく、より軽量に最適化するPhotoshopの機能拡張 -PNG Hat | コリス

比較してみよう

まずはベタッとしたフラットなイラストから
140604-1jpg
jpg(画質60)5.43KB

140604-1png
png 7.14KB

140604-1png oo
PNGoo 3.69KB

140604-1pnghat
PNG Hat 3.69KB

比較してみよう その2

今度はAndroidのステータスバーとイラストです。
140604-2jpg jpg(画質60)37.9KB

140604-2png PNG 195KB

140604-2pngoo PNGoo 74.1KB

140604-2pnghat PNG Hat 74.1KB

比較してみよう その3

もう少し写真が入っているやつで。
140604-3jpg jpg(画質60)24.3KB

140604-3png PNG 172KB

140604-3pngoo PNGoo 66.7KB

140604-3pnghat PNG 66.7KB

考える

うーん…。やはりpngは大きい。しかしPNG Hatで出力すると小さくなる。これは十分実用的。
…あれ?確かPNG Hatを買った($39.99)ときは、なんだか劣化した気がしたのと、Photoshopから使いにくくて止めたんだけど、それなりに使えるんじゃ?

以前はTinyPNGという、PNG画像をサイズ縮小してくれるウェブサイトを使っていました。

TinyPNG – Compress PNG images while preserving transparency

が、これはいちいちウェブ上にアップロードして、それをダウンロードしてから使う、というものでなかなか面倒でした。しかし無料。PNG Hatを買ったのは、このTinyPNGが面倒になったからでした。でも当初はその効果を実感できませんでした。

そして、探しました。それがPNGooです。
PNGooはTinyPNGと同じ仕組み(pngquant)を使ったもので、そのものをローカルにダウンロードして、オフラインで縮小作業ができるというものです。縮小してそのまま元画像に上書き、といったこともできます。

PNGooの使い方

pngquant — lossy PNG compressor

  1. ここのDOWNLOADからPNGooというのをクリックしてダウンロードします。
  2. PNGoo.exeを起動
  3. 140604-4
    縮小したい画像をウィンドウにドロップ。あとは「Go」ボタンをクリックすれば自動的に進みます。

簡単ですね。

まとめ

以前PNG Hatを使った時はなんか気に食わなかったのですが、今使ってみたらあれ?別にいいんじゃない?という気分に。まぁ$39.99払っちゃったしね。
ただ効果はあまり変わらないと思うので、$39.99出さなくてもPNGooで十分だと思いますよ。Photoshop以外で保存したものも使えるし。

んー、でもどうしよう?よっぽどベタ塗りなフラットな奴以外はjpgのほうがサイズ小さいし、画質もそんなに変わらない気がする…。jpgがいいのかな…?

まぁ、いろいろ試していくこととしましょうか。

Random Posts

【アンケート企画】あなたのスマホの持ち方教えてください!2017【結果と考察編】
FREETEL SIMのプランを「定額プラン」へ変更したので人気SNSパケット無料を試してみた
雨【ホーム画面定期コンテスト】
KLWPでタブ切り替え表示(タップでパネル内容の切り替え)を作る
KLWPでワンタップで全く別のテーマに切り替える方法
Changes:アプリのアップデート内容(履歴)を記録していつでも参照できるアプリ
System Info Widget:CPU・RAM・ストレージの使用量を表示するウィジェット
Go Go Summer! 夏に作った過ぎ去りし季節なホーム画面【ホーム画面企画2016】
和シャッター:まるで1つのアプリのような動きを見せるホーム画面【ホーム画面企画2016】
G-Color Xperia XZ用 全面保護TPUフィルム レビュー:見た目は悪くないが指の滑りがかなり悪い
気軽に持ち運びたくなるコード内蔵式の5000mAh薄型軽量モバイルバッテリー dodocool DP09
電池持ちが神がかったスマートフォン、Oukitel K10000ファーストインプレッション【orefolder スマホモニター企画】
ZenFone 5 (ZE620KL) 開封の儀:3年ぶりに手に入れた新しいZenFone 5はピカピカ輝いている
EDGE WALLPAPER:Galaxyのエッジスクリーンのような壁紙を作るアプリ
KLWPを使って夜だけロック解除時に「我、夜戦に突入す!」のスプラッシュスクリーンを出す