PNG は鋭い縁と透明なピクセルを持ちます。切り抜きロゴはそこに合います。旅行の写真は合いません。ファイルが巨大なままです。
高い品質は劣化なしの PNG を書き、そのあと最適化します。それより下では短いパレットが平坦な画面に効きます。
PNG を軽くする
PNG を置く
短いパレットは写真をまだらにし、ロゴは無事、ということがあります。比べてください。
色数を決める
ロゴは高い品質。画面がほぼ平坦なら下げます。
透過を確認
ロゴの穴が白くなっていないか見ます。
PNG がまだ得意なこと
透過
JPEG は切り抜きロゴを持てません。PNG は持てます。
文字が鋭い
領収、コード、チャットは PNG の方が読めます。
PNG をやめるとき
写真なら出力を WebP か JPEG に。どの PNG 最適化よりも減ります。
絵ごとの PNG
| 絵 | 品質 | 理由 |
|---|---|---|
| ロゴ | 95–100 | 劣化なし、アルファあり |
| 画面 | 40–80 | 色を減らし文字は読める |
| 写真 | 形式を変える | PNG の置き場ではない |
PNG の質問
白い箱なしで PNG を圧縮するには？
出力は PNG のまま。JPEG は透過を潰します。
ファイルが大きくなったのは？
最適化済みの PNG は数バイト増えることがあります。品質を下げるか、写真なら形式を変えます。
画面に PNG-8 で足りますか？
色が少なければ多くの場合足ります。グラデーションは縞になります。保存前に比べてください。
PNG を受け取りますか？
受け取りません。パレットと最適化はブラウザです。