邮件营销图片：尺寸、体积和深色模式陷阱
营销邮件里的商品图片：为什么 600px 仍是宽度标准、多大的文件才真的加载得出来、图片被拦截时的替代文字怎么写，以及如何防止深色模式让你的透明 PNG 消失。
- email marketing
- product images
- dark mode email
- image optimization
- transparent png
- ecommerce
你的主题行赢得打开率。你的商品图片赢得点击——前提是它能正常显示。电子邮件是营销里最不友好的设计环境：几十种客户端，每一种都有自己的渲染引擎、自己的图片拦截默认设置，以及越来越强烈的深色模式主张。
在设计工具里完美无瑕的商品照片，送达时经常面目全非：被拉伸得超出版式、在信号不好时太重加载不出来、被一个空白灰框取代，或者——最经典的现代场景——一张透明 PNG 悄无声息地融进深色模式的背景里。
下面讲清楚邮件营销图片该怎么做：宽度标准、文件体积的纪律、真正管用的替代文字，以及深色模式陷阱的真正解法。
邮件里的商品图片该多宽？
营销邮件的标准内容宽度是 600 像素，一些现代模板会放宽到 640。这个数字能一直沿用下来，是因为预览窗格和那些从没跟上响应式的老款桌面客户端。就按它来设计。
- 通栏商品图 —— 导出 1200px，显示为 600。2 倍导出能在高像素密度屏幕上保持边缘锐利，同时不改变版式。
- 多栏网格 —— 把 600px 的内容区分栏，然后每张图都按其显示宽度的两倍导出。
- 显式写上 width 属性 —— 有些桌面客户端会忽略 CSS 尺寸设置，按图片的原始尺寸渲染，一张被遗忘的 2400px 导出图就是这样把整个版式炸掉的。
在这里，越宽并不越好。一张到处都能正常显示的 600px 图片，胜过一张哪儿都显示不出来的 1400px 杰作。
把图片文件体积压下来
每一千字节都是订阅者在用蜂窝网络时要交的税，加载慢的主图还没出现就已经被划过去了。
- 每张图控制在 200 KB 以内，首屏以上的还要更抠一点。放在纯色背景上的干净商品抠图压缩效果非常好。
- 照片用 JPEG，纯色和抠图用 PNG。 WebP 的压缩率比这两者都好——removerbg 支持导出——但邮件客户端的支持仍然参差不齐，所以做营销活动时还是保留 JPEG 和 PNG 母版。
- 注意 Gmail 的截断。 当邮件的 HTML 超过约 102 KB 时，Gmail 会把它截断。托管在外部的图片不计入这个上限，但被截断的邮件会把截断线以下的一切都藏起来——所以代码也要精简。
为被拦截的图片写好替代文字
企业里的 Outlook 和注重隐私的订阅者至今仍会默认拦截图片。这种时候，替代文字就是你全部的视觉层。
- 描述产品和重点 —— “Terra 手冲陶瓷套装，鼠尾草绿”胜过“image1.png”，两者的差距大约就是一单成交和一次删除之间的距离。
- 给它加样式 —— 许多客户端会把替代文字当作可设置样式的实时文本来渲染：设定字体、字号和颜色，让一张被拦截的图片退化成看起来是刻意为之的东西。
- 绝不要把关键信息封进像素里 —— 价格、截止日期和行动号召都应该是真正的文字。就算图片被拦截，这个优惠也应该照样成立。
深色模式陷阱：深色邮件客户端里的透明 PNG
陷阱是这样的。你把干净的商品抠图导出成透明 PNG——对几乎所有其他渠道来说这都是正确做法，我们的透明 PNG 指南解释过——然后把它放进一封按白色背景设计的邮件里。接着客户端把这个背景翻成接近黑色，给深色模式的用户看。你那副炭灰色耳机变成了一个淡淡的轮廓。你的黑色 logo 文字消失了。而那些按白底做过抗锯齿的边缘，泛起了一圈苍白的光晕。
更糟的是，各家客户端对“深色模式”的理解并不一致：有的不动你的颜色，有的只翻转背景，有的几乎什么都重涂一遍。你无法控制订阅者用哪个客户端，所以要做出能在所有客户端里活下来的抠图。
- 直接烘焙一个匹配的纯色背景 —— 与其发送透明图片，不如把抠图压平到一个刻意选定的品牌色上。在 remover.bg 编辑器里把它放到纯色背景上，客户端就没有东西可以翻转了。我们的商品图背景颜色指南能帮你挑一个在两种模式下都撑得住的色调。
- 加描边和留白 —— 在深色边缘的产品周围加一道不显眼的描边或柔和阴影，即使画布被重涂也能保持可辨识。充足的留白能避免过紧的裁切与客户端在四周做的任何处理撞在一起。
- 在真实客户端里测试 —— 每次投放前，都往开启深色模式的 Apple Mail、Gmail 和 Outlook 发一封真实测试邮件。一个客户端尊重的东西，另一个会毫不客气地重新涂一遍。
让整个营销活动里的商品抠图保持一致
一次营销活动很少只有一封邮件。上新、单品聚焦、最后提醒——同一件产品会出现四五次，如果各封之间的处理方式漂移（这里白背景、那里灰背景，一会儿有阴影、一会儿没有），整个序列就会像是用现成零件拼起来的。
定下一套处理方式，然后到处照做：一种背景颜色、一条关于产品占画面多大比例的缩放规则、一种阴影风格——removerbg 的编辑器能添加真实阴影，让抠图稳稳落在画面里，而不是飘着。面对大批量的商品目录，HTTP API 可以自动对每一张图应用完全相同的处理，这正是那套正在悄悄重塑电商中的 AI 的自动化逻辑。
结论
邮件里的图片，生死取决于你按下发送前的四个决定：
- 宽度 —— 按 600px 设计，按 2 倍导出。
- 体积 —— 每张图控制在 200 KB 以内，用 JPEG 或 PNG 以获得最广泛的支持。
- 替代文字 —— 描述清楚、加好样式，绝不把优惠藏起来。
- 深色模式 —— 烘焙背景、给深色边缘加描边、在真实客户端里测试。
把这四点做对，你的产品在每一个收件箱里看起来都是精心安排过的——浅色模式、深色模式、图片被拦截或没被拦截。这一点，大多数营销活动都做不到。
