先に正直な答えを:画像を縮小するのはほぼ目に見える劣化なしにできますが、拡大して本当のディテールを得ることはできません。この2つは限界の異なる別々の操作で、自分がどちらをしているのかを知ると、多くの苛立ちを防げます。ここでは、ピクセルに実際に何が起きるのかを紹介します。
縮小:これはくっきり保たれる

画像を小さくするのは優しい方向です。必要のないピクセルを捨てているだけで、良いリサイズツールは縮小しながら隣り合うピクセルを平均するので、縁がなめらかに保たれます。6000pxのカメラ写真をウェブ用に1500pxへ縮めるとくっきり見えます——そのサイズでは元よりくっきりすることも多いのです。細かいノイズが平均化されるからです。
縮小時に品質を守るものが2つあります。
- 高品質なリサンプリング。 良いツールは単にピクセルを捨てるのではなく、なめらかな補間を使うので、ギザギザでジャギーな見た目を避けます。
- 正しい書き出し形式。 写真は高品質のJPEGかWebPで保存し、くっきりした縁を持つグラフィック、ロゴ、スクリーンショットはPNGで保存します。スクリーンショットにJPEGを使うと文字がにじみ、写真にPNGを使うと巨大なファイルになるだけです。
ウェブには、実際に表示するサイズにリサイズしましょう。800pxの枠に表示される4000pxの画像は帯域を無駄にし、皮肉にも、ブラウザがその場で再拡大縮小したあとにかえって悪く見えることがあります。自分で800pxにリサイズすれば、見た目が良く、読み込みも速くなります。
拡大:期待を管理する

画像を大きくするのは、「画質を落とさずに」が物理にぶつかるところです。余分なピクセルは発明するしかありません、ディテールがそもそも撮られていないからです。基本的な拡大は既存のピクセルのあいだを補間します——画像は大きくなりますが柔らかくなり、縁がぼやけます。そこになかった鮮明さを足しはしません。
| したいこと | 結果 |
|---|---|
| 大 → 小 | くっきり、安全、推奨 |
| 小 → 少し大きく | 許容範囲、軽いぼやけ |
| 小 → はるかに大きく | 柔らかく、ぼやけ、ディテールは発明 |
控えめな拡大(たとえば1.5倍)は、誰も間近で見ない背景には十分でしょう。小さなサムネイルの4倍拡大は、どんなツールでも必ずぼんやり見えます。大きな鮮明な画像が必要なら、本当の対処は、小さいものを拡大することではなく、より大きな元から始めること——元データから書き出し直すか、より高解像度のコピーを見つけること——です。
ブラウザできれいにリサイズする
リサイズツールは、ピクセルまたはパーセントで新しい寸法を設定でき、縦横比ロックの切り替えがあるので、画像は比率を保って決して引き伸びません。高品質な縮小を使うので、写真を縮めてもくっきり保たれます。すべてがCanvasを使ってブラウザ内で動きます——写真はアップロードされず、待ち時間もなく、結果に透かしもありません。
短いルール
- 縮小:どうぞ、縦横比ロックはオンのまま、写真はJPEG/WebP、グラフィックはPNGで書き出す。
- 少し拡大:許容範囲、軽いぼやけを覚悟する。
- 大きく拡大:柔らかく見える——代わりにより大きな元を探す。
- 書き出しサイズを、画像が表示される場所につねに合わせる。
どちらの方向に進んでいるかを知れば、結果は予測できます。無料で、アカウント不要、初回訪問後はオフラインで動き続けます。
