编写HTML电子邮件时的最佳实践和注意事项
我已经开发了十多年的网站，但很快发现我在为web开发时的许多习惯在为电子邮件客户端开发时都是无用的。这给我带来了巨大的挫败感，所以我想我应该问一个问题：
对于像我这样时不时发现自己在为gmail、outlook等设计的人来说，有哪些最佳实践和必要的考虑因素？
示例： <style>...</style> vs inline CSS。
简而言之:什么从网络世界转移到电子邮件世界，什么没有？
回答 3
Stack Overflow用户
发布于 2014-01-30 01:04:18
对于任何想要学习HTML电子邮件的人来说，这似乎是一个很好的列出一些资源的地方。这可能是你在网上能找到的最全面的HTML电子邮件资源列表。祝你学习愉快。
入门指南：
CSS支持和一般指南：
- Campaign Monitor | CSS Support Guide
- HTML Email Boilerplate
- Litmus | Email Clients FAQ's
- Campaign Monitor | Will it work?
- Mailchimp | Email Marketing Field Guide
- Email on Acid | CSS Basics: A Beginner’s Guide to Stylizing HTML
你应该总是在html-email中内联你的CSS。以下是CSS Inlining Tools的列表
响应指南：
- Campaign Monitor | Responsive Support Guide
- Style Campaign | Responsive Support Guide
- Litmus | Responsive How-To Infographic
- Litmus | Big List of Responsive & Mobile Resources
模板和框架：
- Ted Goas | Cerberus Responsive Email Patterns
- Email on Acid | Responsive Template
- Brian Graves | Responsive Email Patterns
- Antwort | Responsive Layouts
- Zurb | Ink Responsive Templates
- Campaign Monitor | Free Email Templates
- Mailchimp | Email Blueprints
响应式备用示例：
- Tuts+ | Responsive Email Without Media Queries
- Stack Overflow | Fluid Example
- Email on Acid | Monster's Fluid Layout
- Style Campaign | Fluid Mobile Email Design
- Stack Overflow | Floating Content
上面的Ted Goas Responsive链接也有一个很好的流畅的例子。
故障排除和一般指南：
- Email on Acid | Yahoo Media Query Bug Workaround
- Stack Overflow | Colspans and Rowspans in HTML Email
- Mailchimp | Outlook Conditional CSS
- Litmus | Banning Blue Hyperlinks
- Stack Overflow | Webfonts in HTML Email
你需要使用VML才能让背景图片在Outlook中工作(in the body tag除外)。以下是一些VML链接：
Stack Overflow用户
发布于 2010-02-09 22:56:02
我为了我的工作(有时)已经做了一段时间了。HTML电子邮件有很多陷阱。不同的电子邮件客户端呈现不同的超文本标记语言，使IE6看起来更高级。
这是我到目前为止所学到的总结。
- Use in-line CSS：样式并不总是表格布局：我知道，但是cope.
- Don't布局依赖于css，并且许多电子邮件客户端不能使用issues.
- Don't ：这会导致奇怪的间距并使用背景图像：支持这些是带有“display：”的div图像标记:这解决了使用多个表将它们嵌套在一个父表中的奇怪间距问题：这会阻止更多奇怪的间距them.
- Provide >不使用Javascript：同样不受支持确保您的电子邮件在没有图像的情况下是可读的：用户可能无法加载Javascript的在线版本并链接到它：这会让用户看到想要的内容，即使他们的电子邮件客户端是terrible.
- Test，测试，测试：仅仅因为它在一个电子邮件客户端上工作并不意味着它在其他电子邮件客户端上也能工作。Outlook 2007是一个很大的亮点。它使用word来呈现超文本标记语言(叹息)。
这远不是一个全面的列表，但应该会让大多数人走上正确的道路。
Stack Overflow用户
发布于 2010-02-09 22:44:02
内联css和表格--想想2000年左右的web开发，你就没问题了。Campaign monitor有一个很好的资源，可以帮助客户处理电子邮件。还可以使用http://www.emailonacid.com/进行测试-省去了发送大量测试的麻烦。
https://stackoverflow.com/questions/2229822
复制相似问题
腾讯云开发者
