如何在不损失质量的情况下调整图片尺寸

调整图片尺寸必然会改变数据。缩小时，软件丢弃像素；放大时，软件创造不存在的像素。正确的重采样滤镜和输出格式能让这种变化在正常观看距离下几乎不可察觉。

重采样方法

调整尺寸时软件使用的滤镜决定了结果的清晰度。

缩小照片时，Lanczos 产生最清晰的输出。对于像素艺术或图标精灵图，最近邻可保持清晰的边缘。

在浏览器中操作

将图片拖入图片尺寸调整工具，输入目标宽度或高度，然后下载。输入尺寸前锁定宽高比，避免拉伸变形。工具在客户端运行——图片不会离开您的设备。

ImageMagick（命令行）

# 调整宽度为 800 像素，保持宽高比
convert input.jpg -resize 800x output.jpg

# 调整为精确尺寸（宽高比不同时会拉伸）
convert input.jpg -resize 800x600! output.jpg

# 在边界框内缩放，不放大
convert input.jpg -resize 800x600> output.jpg

# 使用 Lanczos 重采样
convert input.jpg -resize 800x -filter Lanczos output.jpg

# 调整尺寸并转换为 85 质量的 WebP
convert input.jpg -resize 800x -quality 85 output.webp

> 标志防止放大——在批量处理未知尺寸的文件时非常有用。

sharp（Node.js）

npm install sharp

const sharp = require('sharp');

// 调整宽度为 800 像素，保持宽高比
sharp('input.jpg')
    .resize(800)
    .toFile('output.jpg');

// 调整为精确尺寸，裁剪填充
sharp('input.jpg')
    .resize(800, 600, { fit: 'cover', position: 'centre' })
    .toFile('output.jpg');

// 使用 Lanczos 核心调整尺寸
sharp('input.jpg')
    .resize(800, null, { kernel: sharp.kernel.lanczos3 })
    .toFile('output.jpg');

// 调整尺寸并转换为 WebP
sharp('input.jpg')
    .resize(800)
    .webp({ quality: 85 })
    .toFile('output.webp');

fit: 'cover' 裁剪填充到精确尺寸。fit: 'contain' 添加信箱边框。fit: 'inside' 在不裁剪或填充的情况下适配边界框。

Python：Pillow

from PIL import Image

with Image.open('input.jpg') as img:
    ratio = 800 / img.width
    new_height = int(img.height * ratio)
    resized = img.resize((800, new_height), Image.LANCZOS)
    resized.save('output.jpg', quality=85, optimize=True)

Image.LANCZOS 是 Pillow 中质量最高的下采样滤镜。在 Pillow 10+ 中也可以用 Image.Resampling.LANCZOS。

thumbnail() 方法可自动保持宽高比且永不放大：

from PIL import Image

with Image.open('input.jpg') as img:
    img.thumbnail((800, 800), Image.LANCZOS)  # 适配到 800×800 以内
    img.save('output.jpg', quality=85)

放大问题

放大图片必然损失质量——软件不得不创造原本不存在的像素数据。标准双三次放大在超过原尺寸约 1.5 倍后会出现模糊。

AI 放大工具（Real-ESRGAN、Topaz Gigapixel）在 2–4 倍时效果更清晰，但速度慢，对大多数网络用途来说过于复杂。对于网站，应避免放大：从足够大的源图片开始，覆盖最大显示尺寸。

视网膜屏幕与高 DPI 显示

视网膜屏幕的像素密度是标准屏幕的 2 倍。CSS 宽度为 400 像素显示的图片，需要 800 像素的源文件才能清晰显示。使用 srcset 提供两种尺寸：

<img
  src="image-400.jpg"
  srcset="image-400.jpg 1x, image-800.jpg 2x"
  width="400"
  alt="图片描述"
/>

常见输出尺寸参考

要点总结

• 缩小照片时默认使用 Lanczos 重采样——效果最清晰。
• 永不放大：源图片应始终大于显示尺寸。
• 调整尺寸后，转换为 80–85 质量的 WebP——在保持良好质量的前提下文件最小。
• sharp 的 fit: 'cover' 和 Pillow 的 thumbnail() 都能自动处理宽高比。
• 通过 srcset 为视网膜屏幕提供 2 倍尺寸的图片。