使用WebAIM 对比度检查器等工具来评估颜色对比度。
避免使用细字体。深色背景上的浅色文本会影响可读性,使用细字体会使订阅者更难阅读您的电子邮件。如果您的品牌需要细字体,请在深色模式下将其加粗以提高可读性。
跳过纯黑色上的纯白色: #000000(黑色)上的#FFFFFF(白色)背景可能会导致眼睛疲劳,并且可能会被某些电子邮件客户端自动反转。
测试电子邮件渲染效果。由于暗黑模式在不同的电子邮件客户端中的表现不同,请在发送前在多种设置中预览电子邮件。运行Litmus 测试,查看电子邮件在 100 多个客户端和设备上的渲染效果。
使用工具在构建深色模式电子邮件时进行预览。借助Litmus Builder 中的深色模式编码体验,实时查看更改、轻松进行优化并快速检查视觉可访问性问题。
创建每个人都能体验的电子邮件
通过设计适合所有人的可访问内容来最大化电子邮件的影响力。使用 Litmus,您可以随时进行可访问性检查。
构建可访问的电子邮件
第 2 部分:面向开发人员的暗黑模式电子邮件代码片段 如何设计和编码暗黑模式电子邮件
以下是来自电子邮件社区的九个代码片段,可帮助您解决最大的暗模式难题。
暗模式元标签
暗模式元标签
在 Litmus 社区获取代码 →
针对 Android/Outlook.com 启用暗黑模式
在 Litmus 社区获取代码 →
针对 Apple/iOS 启用暗黑模式
针对 Apple/iOS 启用暗黑模式
在 Litmus 社区获取代码 →
覆盖暗模式背景颜色 覆盖暗模式背景颜色图片来源:Annett Forcier。在 Litmus Community 获取代码 → 在 Gmail 暗黑模式下保持白色文字为白色 在 Gmail 暗黑模式下保持白色 台湾电话号码格式 文字为白色图片来源:Rémi Parmentier。在 Litmus Community 获取代码 → 在 Outlook 的深色模式下保持文本颜色相同 在 Outlook 的深色模式下保持文本颜色相同图片来源:Nicole Merlin。在 Litmus Community 获取代码 → 显示/隐藏暗模式的图片
在 Litmus 社区获取代码 →
修复暗黑模式下的 VML 按钮背景颜色
修复暗黑模式下的 VML 按钮背景颜色
鸣谢:Wilbert Heinen。在 Litmus Community 获取代码 →
使用灰白色/暗色以防止暗色模式下颜色变化 使用灰白色/暗色以防止暗色模式下颜色变化图片来源:Ted Goas / Paul Airy。在 Litmus Community 获取代码 →
第 3 部分:暗模式工具和提示 电子邮件社区最喜欢的电子邮件暗模式工具和技巧
您的同伴#EmailGeeks依靠哪些暗模式最佳实践、工具和资源来了解更多信息并克服其挑战?