给出图片格式选择、批量压缩、懒加载与视频转码的具体做法与收益量级。下面按“先判断、再动手、最后验证”的顺序展开，每一步都给出可核对的检查点。
涉及 图片压缩、WebP、视频压缩 的关键动作都写成了具体命令或配置项，可以照着走，也可以当检查表用。
照片用 WebP 或 AVIF，图标用 SVG，需要透明通道才用 PNG；同一张图换 WebP 通常省 30%–70%。
用 sharp 或 imagemagick 的脚本批量转码并保留原图，改完对比体积与视觉差异再替换。
按展示宽度出图，别用 2000px 原图缩到 400px 显示，srcset 按屏幕出多档。
首屏图片不要懒加载，其余加 loading=lazy，避免 LCP 被拖慢。
站内视频优先走第三方或对象存储加播放器，别直接放服务器根目录，一个 50MB 视频能顶掉整页预算。
| 环节 | 关键动作 |
|---|---|
| 格式选择 | 照片用 WebP 或 AVIF，图标用 SVG，需要透明通道才用 PNG；同一张图换 WebP 通常省 30%–70% |
| 批量处理 | 用 sharp 或 imagemagick 的脚本批量转码并保留原图，改完对比体积与视觉差异再替换 |
| 尺寸匹配 | 按展示宽度出图，别用 2000px 原图缩到 400px 显示，srcset 按屏幕出多档 |
| 懒加载 | 首屏图片不要懒加载，其余加 loading=lazy，避免 LCP 被拖慢 |
Q：按文中写法改完，怎么确认真的生效？
不要只看配置文件，用对应的验证命令或从外部视角复测一次；改完先小流量观察一段，再全量推进，出问题能马上回退。
Q：按文中的步骤做完，还需要注意什么？
把处理过程和最终生效的参数记下来。同类问题再出现时直接对照记录，比重查一遍快得多。
Q：业务规模小，也要按这套标准来吗？
不需要一次到位。先把影响最大的两项做到位，剩余的随着业务增长逐步补齐，比一开始就追求完美更容易落地。
回到这篇的 5 个环节：格式选择、批量处理、尺寸匹配、懒加载、视频。把这几个动作写进检查表，下次遇到同类问题按顺序过一遍，比凭经验跳步骤稳。
相关阅读：统计工具选型：自建Umami与第三方对比、在线客服与工单系统怎么选：自建与SaaS、网站被降权怎么恢复：从掉收录到重新索引。
延伸阅读：图片托管方案：对象存储与图床对比、WordPress图片优化与WebP、CDN接入实操：回源、缓存与防刷配置。
微信公众号
微信客服
