HTML email 构建一封能活过邮件客户端的邮件——古老渲染器需要的 表格结构、内联样式标记,按邮件客户端宽度检查,导出即可发送。 它是为现代 CSS 坟场这个格式准备的模板。
一次邮件的 run 构建什么
按一次活动的方式下 brief——"新套餐的发布邮件:标题、三个卖点、 一个按钮、页脚"——agent 会构建这封邮件:头部、正文区块、行动 号召、页脚,全部是客户端安全的标记。结果在 email viewer 里 打开:按邮件客户端宽度显示的消息,和实际渲染一致。
邮件客户端不是浏览器——Outlook 还在用 Word HTML 渲染,Gmail 会 截断长邮件,深色模式会反转你没设过的颜色。模板为这个现实构建: 用表格不用 flexbox,用内联样式不用样式表,用回退不用特性。
HTML email · Devin · e2e · gate PASS
The Launch Email — The announcement email for this very product — one clear CTA, inlined tables, dark-mode safe.
▸ the prompt that made it▾ the prompt that made it
“Design an HTML email: a launch announcement for a desktop design tool — one clear CTA.”
客户端宽度检查
查看器按真实客户端使用的宽度显示消息——窄收件箱窗格、手机邮件 app——让设计按它实际被阅读的尺寸呈现。门禁检查邮件规则:图片 回退、表格结构、安全字体。
Steering 一封邮件
和任何结果一样的 steering:
- ⌥-click 一个区块,评论确切位置("按钮应该更有分量")
- 后续追加 改结构("页脚下面加一条 PS")
- Tweaks 调参数——强调色、密度、图片尺寸
- Versions ——一版带主图、一版文字为主
它擅长什么
- 发布与活动邮件 ——必须看着对的那份公告
- Newsletter ——在每个客户端都可读的定期版式
- 事务性邮件设计 ——承载品牌的回执和欢迎信
- 邮件模板 ——一系列活动的基底
导出
邮件导出为 HTML——可以粘进发送器的客户端安全标记——以及 供视觉检查或设计文档用的 PNG。文件留在项目里,供下一次活动 或下一版用。
Tip: 尽管模板会强制,还是要在 brief 里写"client-safe"——它 能防止后续追加漂回那些反正会被 Outlook 渲染器剥掉的现代 CSS。