批量压缩图片

图片压缩到底是怎么一回事

图片压缩不是什么魔法，本质上是一连串取舍。搞清楚每个参数到底动了什么，差别就是「网页体积减半」和「照片糊成一团」。

有损与无损

有损压缩（JPEG、WebP、AVIF）会丢掉一些你的眼睛大概率注意不到的细节，再用更聪明的方式把剩下的存下来。所以一张 JPEG 可以只有原图十分之一大小，看起来却几乎一样。无损压缩（PNG，以及无损模式的 WebP）每个像素都原样保留——能压的空间有限，但画质一点不损。

实用原则：照片、以及任何带平滑渐变的内容，走有损。截图、图表、logo、带文字的图，走无损——有损压缩会把锐利的边缘糊掉，小字尤其明显。

画质滑块到底在调什么

画质数值代表的并不是「原始画质的百分比」。它选的是一张量化表：编码器把频率数据舍入到多粗。由于人眼的感知方式不是线性的，画和体积之间的关系也不是线性的。几个有用的分界点：

• 90–100%——几乎看不出差别，但文件依然很大。除了印刷流程，一般没必要。
• 75–85%——照片的最佳区间。盲测时大多数人分不出来，体积却通常能减 60–80%。
• 50–70%——凑近看会有明显软化。用在缩略图和预览图上可以接受。
• 50% 以下——出现块状伪影和色彩断层。只有在体积压倒一切时才这么干。

输出格式怎么选

如果你在优化网站，WebP 是稳妥的默认选择，AVIF 是激进选择。两个都用 <picture> 元素提供给浏览器，让它自己挑。

为什么改尺寸比调画质更管用

这一点最容易被忽略：把图片的宽和高各减一半，像素数会掉掉 75%。光是这一下，效果几乎总能胜过任何画质调整。给网站配图时，先缩到实际显示的最大尺寸，然后再去管画质。一张 4000 像素宽的图放在 800 像素宽的栏位里，怎么压都是浪费。

会改动我的原图吗？

不会。源文件从不被修改。每张处理完的图片都是在浏览器内存里新生成的文件，然后交给你下载。你硬盘上的原图始终原封不动。