邮件排版

工具

• 查看邮件打开率，点击率，排版技巧等
  

怎样评价一封邮件的排版

• 内容优先
  
• 需要适配 PC，mobile，pad 的屏幕
  
• 手机、Web 端在邮件收件箱视图里能看到概要信息, 把重要数据显示在概要里，类似验证码短信会把验证码排前显示一样。
  

邮件排版相对 web 排版的特殊之处

• 只能使用 table 来排版 layout (tr>td 里再嵌套 table)
  
• css 推荐写成 inline 样式. head 里的 style 有可能被 email client 过滤掉。
  
• 宽度不要超过 600px，目前我使用的是 580px
  
• 图片域与邮件域最好相同
  

template

推荐使用 https://github.com/seanpowell/Email-Boilerplate 中的 email_lite.html
作为初始模板。

template render

对 html 中的变量做替换时，推荐使用 tornado 的 template.

Show me the code:

tornado template

如何调试

如果每修改一次就发送一封测试邮件，显然很麻烦，而且邮件发送通常有延迟。

最好的方法是，先用一个 web server 将需要发送的 HTML EMail 当成网页来调试。调试
的差不多了，再发送邮件进行确认。

参考

• http://stackoverflow.com/questions/9732580/has-anyone-gotten-html-emails-working-with-twitter-bootstrap
  
• http://htmlemailboilerplate.com/
  
• “欢迎使用新版 Gmail 收件箱” 的推广邮件
  
• HTML Email 编写指南
  
• litmus 付费、但是很使用的服务
  

关于作者 🌱

我是来自山东烟台的一名开发者，有感兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊，或者关注我的个人公众号“大象工具”， 查看更多联系方式