图片颜色在不同设备上显示不一致，是网站维护中经常被问到的问题。尤其是WebP格式普及之后，同一张图在有的浏览器里正常，在旧版Safari里却偏绿、偏暗，排查起来容易走弯路。下面按从文件到页面的顺序，整理一套可执行的核对流程。
第一层，先看文件本身的色彩配置。重点是WebP文件有没有携带ICC配置文件，以及是否写入了明确的色彩空间标记。部分图片在导出环节被剥离了配置文件，浏览器只能按默认色彩空间去猜，不同内核猜的结果不一样，偏色就出现了。核对方法有两个：用图像工具的属性面板查看ICC信息；或者对比同一画面的PNG、JPEG版本，如果带配置的版本显示正常，基本可以判断是配置文件缺失。处理方式不复杂，把图片重新导出为带sRGB配置的版本，再上传替换即可。
第二层，核对服务端转码与缓存策略。网站维护中常见的隐形问题是图片在传输链路里被二次处理：压缩插件重新编码、CDN按设备输出不同格式、缓存里存着旧版本文件。核对时要确认三件事：服务端是否对WebP做了自动压缩；是否按User-Agent返回了不同色彩空间的副本；浏览器拿到的文件与源文件哈希是否一致。如果发现缓存中的文件与源文件不符，先清理对应缓存再复测，避免在错误的文件上反复排查。
第三层，核对页面层面的干扰。CSS滤镜、混合模式、半透明容器背景色都会改变图片的观感。旧版Safari对某些滤镜和混合模式的支持不完整，叠加后可能呈现出偏绿效果。排查方法是临时移除图片所在容器的滤镜、透明度和背景色，单独加载图片做对比。如果移除后颜色恢复，问题就在样式层，而不是图片本身。这一步容易被跳过，但实际维护中占比不低。
第四层，核对浏览器版本与回退方案。旧版Safari对WebP的支持存在版本差异，部分版本解码正常但色彩管理不完善。可执行的兼容清单包括：为图片准备JPEG或PNG回退源，通过picture元素按支持情况加载；在服务端根据请求头判断是否输出回退格式；对必须使用WebP的场景，统一导出为sRGB并避免依赖浏览器默认色彩推断。具体版本的支持范围应以浏览器官方文档为准，不要凭经验下结论。
把以上四层串起来，就是一套从文件到页面的排查顺序：先本地复现分流，再查ICC配置，再查传输链路，再查页面样式，最后落到版本兼容与回退。it数运在处理此类维护问题时，通常也按这个顺序推进，先确认文件本身是否完整，再逐层排除外部因素，避免一上来就大改代码。颜色问题看似小，排查路径清晰了，处理起来并不复杂。
