为网站速度优化图片
图片通常是网页中最重的资源类型。如果不优化，它们会拖慢加载速度、影响 Core Web Vitals，甚至降低转化。一个可靠的图片优化流程并不复杂：尺寸正确、格式合适、压缩得当。
图片如何影响 Core Web Vitals
大图片会拖慢关键内容的渲染，并可能拉高 LCP。未声明尺寸的图片还可能引发布局偏移，影响 CLS。控制图片体积和尺寸，是改善真实用户性能最直接的方法之一。
- 减小图片体积可改善 LCP
- 使用正确尺寸可避免浪费
- 设置宽高或宽高比可减少 CLS
一份实用优化清单
优先处理首屏图片和高流量页面上的图片。先调整到实际显示尺寸，再压缩，并在合适时优先使用 WebP。装饰性图片应尽可能轻量。
- 调整到实际显示尺寸
- 压缩以降低传输体积
- 优先使用 WebP
- 先处理首屏图片
可重复执行的流程
先用图片缩放工具匹配布局尺寸，再压缩体积，必要时转成 WebP。对于团队协作，建议为主图、正文图和缩略图设定统一目标体积。
相关工具
将此工具与其他工具结合的相关流程。
相关工具
将此工具与其他工具结合的相关流程。
按需求
直达你需要的结果。
常见问题
网页图片多大才算合理？
要看布局，但常见目标是：主图低于约 200 KB，正文图片低于约 120 KB，缩略图低于约 30 KB。
优化图片对 SEO 有帮助吗？
有。更快的页面能提升用户体验和 Core Web Vitals，这些表现通常对长期 SEO 有帮助。
应该把所有图片都转成 WebP 吗？
对大多数网站来说可以。WebP 通常压缩效果很好。只有在确实需要透明背景或流程必须保留 PNG 时，才继续使用 PNG。