WebP品質の素早い決め方（80/85/90の境界と再調整手順）
品質(Q値)を議論するとき、社内チャットは往々にして 「まだ荒い」「もっと上げたい」「差が分からない」 といった主観語で埋まりがちです。ここで迷走すると再書き出しの往復が増え、公開が遅れ、最終的に「全部90でいい」に丸め込まれ容量が肥大します。 本稿はその沼を避けるための “初期一括 80 → 局所 +5%” という決め打ちフレームを背景理由付きで提示します。
目的は「全体の 80% 以上の画像を最小工数で適正帯に乗せ、例外だけに議論時間を割く」ことです。境界値に迷う時間を、差分確認と劣化原因の前処理（ノイズ/シャープ順序）へ移し替えます。
0. なぜ 80 スタートなのか
過去案件/公開計測(社内 30+ ページ、総画像約1200枚) の比較では WebP 写真で Q=80→85 の容量増は平均 +9〜12% でしたが、体感差(原寸等倍) が明瞭だったのはおよそ 15% 程度 (肌グラデ/逆光文字) の限定ケースのみでした。境界シナリオの割合は 20% 未満。つまり 最初から85で全量書き出すと 80% の画像で無駄な増量 になります。
- 80→85 は多くの素材で“安全側”に倒し過ぎ
- 80→90 は過剰 (リングやバンディング根本要因は前処理不足なことが多い)
- 75 以下はリスク（細文字のにじみ/肌のムラ強調）
1. 起点値（まず80）
- ほとんどの写真で 80 は視覚差 (原寸等倍) で許容内。
- エッジ/細テキスト/グラデ背景は劣化を検出しやすい領域。
- 比較は /compare の差分スライダーで。
初期一括 80 出力を “ベースライン” と呼び、差分記録を残すことで後の再最適化や別コーデック比較(AVIFなど) の効果検証にも再利用できます。
2. 判定観点（どこを見るか）
- 文字: 細ウェイト/逆光文字でにじみ・ジャギ。
- グラデ: 空/ボケ背景でバンディング。
- 肌: 頬/額の色ムラ・リング。
- 高コントラストエッジ: アイコン/ラインUIのギザ。
観察は“等倍＋スクロール一往復”で完了させます。ズーム 200% 以上は実使用環境で不可視な微細ノイズを気にする沼に入りやすいので避けます。
3. 再調整ルール (+5 で足りる)
| 症状 | 調整 |
|---|---|
| 細文字が滲む | 該当画像のみ 85 |
| 肌/グラデでバンディング | 85 でも残るなら 90（それ以上は漸減） |
| リング/エッジ破綻 | 再圧前に 前処理 |
| 全体差分が僅少 | 80継続（TCO優先） |
“全体を一律85” へ上げると調整ログが消え改善効果を説明しにくくなります。局所 +5 の差分だけ git に残し議論を閉じます。
4. 公開前チェック（5項目）
- 原寸等倍で文字にじみなし
- グラデの段差最小
- 肌の色ムラ/リング許容内
- 差分比較でアーティファクト顕著でない
- 再書き出しは局所のみ（全体+5しない）
チェック担当が複数人になる場合は “指摘テンプレ” を 1 行 JSON 形式 ( {"file":"hero.jpg","issue":"文字にじみ","action":"+5"} ) で残すと抜け漏れを減らせます。
5. まとめ
“まず80 → 局所だけ 85/90” の段階調整で、判断のばらつきを抑えつつ容量/時間のトレードオフを最適化できます。境界ケースを例外運用に閉じ、他の最適化領域（解像度/プレースホルダ/優先度）へリソースを回してください。詳しい品質指標や他コーデック比較は 詳細ガイド を参照。
付録: よくある誤解 (FAQ)
- Q. 画面が写真主体なので最初から 90 にしておきたい
- 高Q一括は“後から下げる” 判断が心理的に難しく逆戻りが起きやすいです。まず 80 ベースラインで差分なしを確認し、例外だけ上げた方が説明可能性が残ります。
- Q. 85 と 90 の見分けが付かない
- 見分けが付かないなら 85 で良いサインです。「安心のため」の上乗せは技術的負債になります。
- Q. 80 でリングが出る
- 先にノイズ低減→軽いアンシャープ→再エンコードの順序を検証してください。前処理不足が原因なら Q を上げても改善は限定的です。