像素、宽高比和适配方式
每张数码图片都是由像素组成的网格。现在手机拍的照片通常是 4032 × 3024 像素(1200 万像素)甚至更大,远远超过大多数用途的需要。全高清屏幕是 1920 × 1080,大多数网页上的图片宽度不到 1600 像素,微信等聊天软件也会把大图自动缩小。
宽高比是宽度和高度的比例。4032 × 3024 是 4:3,1920 × 1080 是 16:9。如果改尺寸时不保持比例,就要决定多出来或缺少的部分怎么处理,这就是适配方式的作用:
- 裁剪填满让主体保持够大,从四周均匀裁掉多余的部分。适合缩略图、头像和社交平台配图。
- 完整显示并留边保留整张图,在两侧或上下补边。适合商品图,以及任何裁掉会丢失重要内容的图片。
- 拉伸强行把图片塞进目标尺寸,会变形。只适合纹理或特意要的效果。
国内常见的尺寸要求
很多网上报名和办事系统,除了限制文件大小,还会限制照片的像素尺寸。例如有的考试报名要求照片是 295 × 413 像素(相当于一寸照片),有的要求宽度在 300–500 像素之间,电商平台的商品主图常见 800 × 800。遇到这类要求,只要按要求填写宽和高、选“裁剪填满”,就能一次把整批照片调好。如果比例对不上、又不想让工具从中间自动裁剪,可以先用图片裁剪手动框选,再来这里调整尺寸。
这里的缩放是怎么做的
图片先在后台 Web Worker 里解码,按 EXIF 方向信息旋转,然后用 Squoosh 项目的 Lanczos3 滤镜(编译成 WebAssembly)重采样。和大多数浏览器、手机应用用的简单双线性缩放相比,Lanczos 会参考更大范围的周围像素,能保留细节,避免廉价算法造成的锯齿或模糊。带透明背景的图片用预乘透明度的方式缩放,半透明的边缘不会出现黑色的毛边。
尺寸与文件大小
缩小尺寸是让图片文件变小最有效的办法。像素数随边长的平方增长,4000 × 3000 的照片像素数是 2000 × 1500 的四倍,文件通常也大三到四倍。如果上传时提示照片太大,把长边缩到 2000 像素往往就够了,在电脑和手机屏幕上看依然清晰。如果有严格的大小限制,调完尺寸再用图片压缩压到指定 KB。
要按小红书、公众号、抖音、淘宝主图等平台的标准尺寸调整,可以直接用社交平台图片尺寸工具,里面已经预设好了。