Email.md

4天前发布 6 00

Email.md 将 Markdown 转换为响应式的、邮件安全的 HTML,可在 Gmail、Outlook、Apple Mail、Yahoo 以及其他所有邮件客户端中正常显示。

所在地:
美国
收录时间:
2026-03-28
其他站点:
Email.mdEmail.md

在 Web 开发中,写 HTML 是基本功;但在邮件开发中,写 HTML 是一场噩梦

Outlook 使用 Microsoft Word 渲染引擎,Gmail 会无情剥离 <style> 标签,Yahoo 有独特的解析怪癖,而 Apple Mail 又过于自由。为了让一封简单的邮件在所有客户端(尤其是桌面版 Outlook)中正常显示,开发者不得不编写深层嵌套的表格 (<table>)、强制内联 CSS,并堆砌大量针对特定客户端的 Hack 代码。

Email.md

Email.md 允许你直接使用熟悉的 Markdown 语法撰写邮件内容,然后自动将其转换为响应式、内联样式化、且兼容所有主流邮件客户端的安全 HTML。

核心价值:简单、兼容、AI 友好

1. 回归本质:只写 Markdown

你不再需要记忆哪些 CSS 属性在 Gmail 中有效,也不需要理解为什么 Outlook 不支持 div 布局。

  • 输入:标准的 Markdown(标题、列表、链接、图片)。
  • 输出:经过深度优化、表格化布局、样式内联的完整 HTML 邮件。
  • 效率:将原本需要数小时的邮件模板开发时间缩短至几分钟。

2. 全客户端兼容 (Client-Agnostic)

Email.md 内置了针对主流邮件客户端的适配规则,确保你的邮件在以下平台完美渲染:

  • ✅ Gmail (Web, iOS, Android)
  • ✅ Outlook (Windows Desktop, Web, Mac)
  • ✅ Apple Mail
  • ✅ Yahoo Mail
  • ✅ Thunderbird 及其他

它自动处理了“样式内联化”、“表格布局转换”和“客户端前缀”等繁琐工作,覆盖了 80% 以上 的常规邮件设计需求。

3. AI 的原生搭档

这是 Email.md 最强大的隐性优势。大型语言模型 (LLM) 非常擅长写 Markdown,但不擅长写邮件 HTML。

  • 以前:你让 AI 写一封邮件 HTML,它生成的代码往往在 Outlook 中崩坏,你需要人工修复。
  • 现在:你让 AI 写一封 Email.md 格式的邮件,它能瞬间生成完美结构。你只需调用 render() 函数,即可得到生产级代码。
  • 工作流提示词 -> AI 生成 Markdown -> Email.md 转换 -> 发送

快速上手

安装

npm install emailmd

基础用法

只需几行代码,即可将 Markdown 转换为包含 text/html 和 text/plain 双版本的邮件内容:

import { render } from "emailmd";

const content = `
# 欢迎加入!👋

感谢注册 **Email.md**。我们很高兴有你加入。

### 接下来做什么?

1. 验证你的邮箱
2. 完善个人资料
3. 探索功能

[立即开始](https://example.com/start){button}

> "简单,才是终极的复杂。"

祝好,
The Team
`;

const { html, text } = render(content);

// html: 完整的、内联样式的、表格布局的邮件安全 HTML
// text: 自动生成的纯文本版本,用于兼容性 fallback

高级特性:按钮与组件

Email.md 扩展了 Markdown 语法,支持常见的邮件组件。例如,给链接添加 {button} 后缀,它会自动渲染为兼容 Outlook 的 VML 按钮或表格按钮:

[点击这里购买]{button .primary}
[稍后提醒我]{button .secondary}

典型应用场景

场景传统痛点Email.md 解决方案
事务性邮件每次改文案都要动复杂的 HTML 结构直接修改 Markdown 文本,逻辑与样式分离,维护极简。
营销通讯 (EDM)设计师给的 Figma 转 HTML 成本极高运营人员直接用 Markdown 撰写,AI 辅助排版,即时预览发送。
AI 自动生成AI 生成的 HTML 兼容性差,需人工修复AI 生成 Markdown,Email.md 保证输出兼容性,实现全自动流程。
多语言邮件每种语言都要维护一套 HTML 模板只需维护多套 Markdown 内容,共用同一套渲染逻辑。

技术原理

Email.md 在底层执行了复杂的转换管道:

  1. Markdown 解析:将 Markdown 转换为 AST (抽象语法树)。
  2. 语义映射:将 AST 节点映射为邮件安全的 HTML 结构(主要是 <table><tr><td>)。
  3. 样式内联:将所有 CSS 样式强制写入标签的 style 属性(因为 Gmail 等会丢弃 <head> 中的样式)。
  4. 客户端修复:针对 Outlook 添加 VML 代码以支持圆角按钮和背景图,针对 Gmail 添加特定的元数据标签。
  5. 纯文本生成:同步生成一份干净的纯文本版本,确保在不支持 HTML 的客户端中也能阅读。

数据统计

相关导航

暂无评论

none
暂无评论...