网页优化
网页图片优化：从尺寸和压缩到加载策略
先处理最大的资源
用浏览器网络面板检查图片传输大小及加载顺序。优先优化首屏大图和重复出现的商品图。记录处理前后的大小、页面加载表现和视觉效果，避免只根据一个质量数值判断结果。
尺寸与格式
按实际布局需要准备图片，考虑高像素密度屏幕，但不要把相机原图直接用于小缩略图。照片可比较 JPEG、WebP 和 AVIF，透明图形可比较 PNG 与 WebP。裁剪应围绕内容主体，不能只靠 CSS 隐藏多余像素。
压缩与元数据
从原图导出多个质量样本，检查文字边缘及细节后选择体积较小且可接受的版本。无损压缩也可以通过清除不需要的元数据减小文件。移除 EXIF 不会遮盖图片中已经可见的个人信息。
加载优先级
首屏关键图片应正常加载，不要延迟加载可能成为 LCP 的图片。折叠区域之外的图片可用 loading=lazy。只为确实关键的图片使用预加载或高优先级，过多的优先资源会互相竞争带宽。
布局与交付
为图片设置 width 和 height 或稳定的宽高比以预留空间。用 srcset 和 sizes 提供适合屏幕的资源。CDN 可缩短访问距离并缓存变体，但不能代替合理的源尺寸、缓存策略与真实设备测试。
动手处理文件
保留原始文件，先用一个样本检查结果，再处理其他文件。imgpact 在您的浏览器中处理所选文件；首次加载软件仍需要网络连接。