免费工具 图片压缩：在线压缩图片大小，不上传服务器
把照片或截图拖进来，选好格式、质量和最大尺寸，图片就在你自己的电脑或手机上重新编码。每张图都能看到压缩前后的体积、并排对比画质，以及去掉了哪些看不见的信息（比如拍摄地点）。
- 图片不出本机
- 批量处理、打包下载
- 按网页加载速度来压
压缩图片、转换格式
设置对所有图片生效，改了会自动重新压缩。截图后在页面上按 Ctrl+V（Mac 按 Cmd+V）直接粘贴，也可以先用示例照片试试。
照片从 80 开始试比较合适。
自动一档档降低质量，直到不超过这个大小。适用于 WebP、JPEG、AVIF。
JPEG 不支持透明，透明部分会填成这个颜色。
只在格式和尺寸都不变时生效。
还没有图片。选择、拖入或粘贴图片，也可以先用示例照片试试。
压缩前
—
压缩后
—
节省
—
压缩前后对比
在图上左右拖动，或拖下面的滑块：分界线左边是原图，右边是压缩后的图。重点看边缘、文字和天空这类渐变，压缩痕迹最先出现在这些地方。
一张 1200 万像素的手机照片，缩小尺寸后少了多少
4032 × 3024 的照片按「最大宽高」等比缩小。像素数决定了文件体积和解码时占的内存，所以缩小尺寸通常比调低质量省得多。
| 最大宽高 | 输出尺寸（像素） | 减少的像素 | 解码后占用内存 |
|---|---|---|---|
| 原图 | 4,032 × 3,024 | — | 46.51 MB |
| 2,560 像素 | 2,560 × 1,920 | −60% | 18.75 MB |
| 1,920 像素 | 1,920 × 1,440 | −77% | 10.55 MB |
| 1,200 像素 | 1,200 × 900 | −91% | 4.12 MB |
| 800 像素 | 800 × 600 | −96% | 1.83 MB |
解码后内存 = 宽 × 高 × 4 字节（红、绿、蓝、透明各 1 字节），和文件多大无关。压缩后的文件大小取决于画面内容，所以工具实际编码后再告诉你，不靠估算。
版本 v1.0更新于 更新记录
每张图下面的数字分别是什么意思
每一行都写着尺寸、体积和改了什么。下面告诉你怎么判断结果能不能直接用。
尺寸：压缩前 → 压缩后
最管用的一项。手机直出的照片常常宽 4000 像素，而公众号正文、博客栏目、商品详情页的显示宽度通常不到 1000 像素，就算照顾高清屏，1600～1920 也足够。宽度减半，像素就少了约四分之三。
体积和节省比例
编码后实际文件的大小，不是估算。节省比例显示为红色、带加号，说明新文件反而更大：常见于把已经压过的图再压一遍，或者把照片存成 PNG。
质量
编码器的参数，范围 10～100。它不是「保留原图百分之几的画质」，同一个数字在 JPEG、WebP、AVIF 下效果也不一样，最终以对比图里肉眼看到的为准。
已去除的信息
原图里藏着的拍摄地点、手机型号、拍摄时间、色彩配置文件等。浏览器画布编码时只写像素，这些信息在输出文件里都没有了，顺带也省下几 KB。
给网页用的图，按它在页面上实际显示的大小来检查画质。放大到 300% 才能看出的瑕疵，正常大小下往往看不出来。
四步压缩图片大小
默认设置（WebP、质量 80、最长边不超过 1920 像素）适合大多数网站配图。
-
1
添加图片
点击选择、把文件拖进虚线框，或截图后直接按 Ctrl+V 粘贴。一次最多 60 张。
-
2
选格式和尺寸
网站用 WebP；对方后台不收 WebP 时用 JPEG；截图要求一个像素都不能变时用 PNG。最大宽度填图片在页面上显示的最大宽度，高清屏再乘以 2。要满足「不超过 200KB」这类上传要求，勾选「压到指定大小以内」。
-
3
看对比图
点节省最多的那张的「对比」，拖动分界线看边缘和文字。质量一直往下调，调到能看出差别，再往回调一档。
-
4
下载
单张下载，或者「全部下载」打成一个 ZIP。文件名不变，只换扩展名。
图片小了，网页的「最大内容绘制」为什么会变快
最大内容绘制（LCP）是指首屏里面积最大的图片或文字块画出来的时间。web.dev 把它拆成四段：服务器首字节时间、资源加载延迟、资源加载耗时、元素渲染延迟。最大的元素是图片时，图片文件多大直接决定「资源加载耗时」这一段。
- LCP 良好的标准：至少 75% 的访问在 2.5 秒以内（web.dev）
- 文件体积 ≈ 像素数 × 每个像素平均占的字节：缩小尺寸减少前者，调质量、换格式减少后者
- 本工具把图片画到 canvas 上，每次最多缩小一半、分几步缩到目标尺寸（小图更清晰），再用
canvas.toBlob(格式, 质量)编码 - 压缩解决不了服务器慢、图片发现得晚的问题：给图片写
width/height，首屏大图不要加loading="lazy"，可以加fetchpriority="high"
| 格式 | 压缩方式 | 透明 | 适合 |
|---|---|---|---|
| WebP | 有损或无损 | 支持 | 网站照片和配图；主流浏览器新版本都能显示 |
| AVIF | 有损 | 支持 | 照片体积通常更小；只有浏览器能编码时才会出现这个选项 |
| JPEG | 有损 | 不支持 | 发邮件、各种上传表单，以及不收 WebP 的后台 |
| PNG | 无损 | 支持 | 要求像素不变的截图和界面图；重新保存很少会变小 |
一张手机照片放到博客里，要做三个决定
一张 4032 × 3024 的照片，要放进正文栏宽 800 CSS 像素的文章里。
| 步骤 | 怎么决定 | 结果 |
|---|---|---|
| 1. 尺寸 | 栏宽 800 × 2（高清屏）→ 最大宽度 1600；整屏宽的头图可以用 1920 | 按 1920：1920 × 1440，像素少了 77% |
| 2. 格式 | 网页用 WebP、质量 80；只有平台不收 WebP 时才另存 JPEG | 照片通常能省下一大半，具体以工具实测为准 |
| 3. 检查 | 按实际显示大小对比，重点看天空渐变和细小文字 | 降质量到出现瑕疵，再往回调一档 |
| 内存 | 原图和 1200 像素版本解码后占的内存 | 46.51 MB 对 4.12 MB：手机要把它全部放进内存才能画出来 |
像素数和内存是精确计算；压缩后的文件大小取决于画面内容，用工具实测，不要套用经验比例。
压缩图片时最容易做错的事
网站上大多数「图片太大」，问题不是压得不够狠，而是尺寸本来就太大。
直接上传相机原图
4000 像素宽的照片只显示 800 像素宽，每个访客都要下载、解码长宽各 5 倍的像素。先缩尺寸，再压质量。
同一张 JPEG 反复压
有损格式每保存一次都会多一层瑕疵。保留原图，每次从原图压，不要拿上次导出的文件再压。
照片存成 PNG
PNG 是无损的，照片存成 PNG 体积会很大。纯色界面截图用 PNG，照片用 WebP、AVIF 或 JPEG。
首屏大图加了懒加载
首屏最大的那张图加 loading="lazy" 会推迟 LCP。懒加载留给页面下方的图片。
看看图片有没有拖慢真实访客
压缩图片是解决办法，哪些页面需要先压，要看真实访客的数据。TapCub 的统计代码在访客自己的设备上测量本页讲的最大内容绘制（LCP）。
如何压缩图片大小？
两步：先把尺寸缩到图片实际显示的最大宽度（高清屏乘以 2），再存成 WebP 或 JPEG、质量 70～85。缩小尺寸通常比调低质量省得多。在本页把图片拖进来，默认设置就是这么做的。
怎么把图片压缩到 200KB 以下？
勾选「压到指定大小以内」，填 200，工具会自动降低质量直到不超过 200 KB；质量降到最低还不够，就把最大宽度调小。本工具按 1 KB = 1024 字节计算，如果报名系统等网站按 1000 字节算，目标填得比要求略小一点（比如 190）更稳妥。
压缩图片会上传到服务器吗？
不会。解码、缩放、编码都由浏览器的 canvas 在本机完成，页面打开后断网也能用。
WebP 和 AVIF 选哪个？
主流浏览器的新版本都能显示这两种格式。AVIF 压照片通常更小，但编码慢一些，而且只有你的浏览器能编码 AVIF 时这里才会出现这个选项。要兼容很老的设备，用 <picture> 标签同时提供 JPEG 作为后备。
为什么 PNG 压缩后反而变大了？
浏览器保存 PNG 是无损的，也不会做 PNG 优化工具那种减少颜色数的处理，原图已经优化过的话就会变大。改成 WebP，或者缩小尺寸。勾选「新文件更大时保留原图」时，工具会直接给你原图。
压缩后照片里的位置信息还在吗？
不在了。输出文件只有像素，GPS 定位、手机型号、拍摄时间等 EXIF、XMP、IPTC 信息都会去掉，每张图下面会列出原图里有哪些。照片的拍摄方向会先应用到像素上，所以去掉方向信息后照片仍然是正的。
iPhone 拍的 HEIC 照片打不开怎么办？
Chrome 等浏览器不能解码 HEIC。可以用 Safari 打开本页，或者在 iPhone「设置 → 相机 → 格式」里把「高效」改成另一个选项，以后拍的照片就是 JPEG。
图片多大会影响网页打开速度？
首屏最大的元素是图片时，它的下载时间算在 LCP 里，LCP 的良好标准是 75% 的访问在 2.5 秒以内。手机网络下图片越小越明显；服务器慢、图片发现得晚，要另外处理。