有没有一种方法可以查看营销云电子邮件符合哪些可访问性标准？

Question

我们有一个项目，在我目前的工作，以确保我们满足我们的网站的无障碍标准。

我们的电子邮件是建立使用Salesforce营销云布局。有没有人知道我们如何看到或测试他们是如何‘可访问’的？

我可以使用ReturnPath进行测试，看看它们在各种设备上是如何呈现的，这给了我色盲的结果，但我不确定如何测试它们在屏幕阅读器上的工作效果。

Answer 1

从可访问性的角度来看，电子邮件是很难的。即使在2021年，我们仍在使用表格进行布局！

我们不能使用WAI-ARIA和CSS是非常有限的。

因此，我有一个较小的电子邮件清单，涵盖了我们可以控制的重要事情。

我要看的主要事情是：

阅读顺序

确保电子邮件从左到右，然后向下读(假设该语言是一种从左到右的语言，否则将其反转)

使用标题

电子邮件营销人员通常只是普通文本的样式，而不是适当的标题。确保标题实际上是<h2>到<h6>，在开始时只有一个<h1>解释邮件的用途。

还要确保标题不会跳过级别(例如，不要从<h2>跳到<h4> )。

色彩对比

同样的规则也适用于电子邮件。我会建议运行颜色通过网络目标颜色对比检查器为您的文本和背景周围的文本，按钮背景和文本等。

Alt属性

图片上的Alt属性是您需要检查的重要属性，特别是在电子邮件中，图像可能是超链接中唯一的内容。由于不能在电子邮件中使用aria-label或视觉隐藏文本，所以只有通过alt属性才能使链接具有意义，如果链接包含图像(加上电子邮件客户端阻塞图像，则意味着对其他所有人都有有意义的文本，而不仅仅是屏幕阅读器用户)。

有意义的链接文本

按照同样的思路，确保链接不只是说“阅读更多”。相反，使链接文本有意义。“阅读我们关于X Y Z的文章”。

使用描述性主题行

这是唯一一个“困难”的营销人员。你想让主题线引起人们的兴趣来打开电子邮件，但是对于有认知障碍的人来说，隐晦的主题线可能是令人不安/令人困惑的等等。

要在“放弃游戏”和有意义的主题之间取得平衡是很困难的，如果不确定是否有意义(它可能会帮助你的开放率/转换率，所以A/B来测试它！)

浏览器视图

由于电子邮件客户端的局限性，确保可访问性的最佳方法是在电子邮件中具有自定义的“浏览器中的视图”链接(因为salesforce等不太可能很好地完成电子邮件的浏览器版本)。

通过这种方式，您可以使用WAI-ARIA、visually hidden text等，并按照WCAG2.1(很快WCAG2.2)的要求正确地标记页面。

显然，我知道这需要做大量的工作，但是一旦您构建了一个模板和组件，并且这些组件都是可访问的，它就会变得容易得多。

测试

就我个人而言，我只需要手动测试，但我确信在某个地方，电子邮件测试服务类似于Axe可访问性检查器。

但是，考虑到一封典型邮件的长度，我会说，一旦你知道要查找什么，手动检查只需要2分钟，所以一项服务可能不值得。

您可以始终将电子邮件HTML复制并粘贴到文件中，并以.html扩展名保存它，然后在浏览器/辅助功能检查器中打开并测试它。但是，由于使用表进行布局，您可能会遇到大量无法解决的问题。

终于--学习使用屏幕阅读器需要不到一个小时的，抓取NVDA或VoiceOver并自己测试电子邮件，如果您能够理解它并访问所有与其他人相同的信息，然后发送它！