HTML 电子邮件最佳实践：仅包含图像的电子邮件是否不利于营销？

已发表: 2022-11-24

成功的企业高度重视执行他们的品牌标准——这是理所当然的。这是他们与客户关系的直观表现，他们通过始终使用相同的字体、颜色、徽标和图像样式来保持这种融洽关系。

这就是为什么当您开始为您的客户制定电子邮件营销策略时，却意识到您仅限于网络安全字体，无法轻易地在图像上覆盖文字，并且无法控制文本的确切外观，这可能会如此令人震惊因为填充或边距因收件箱而异。

因此，您可能会想创建一个仅包含图像的模板，以便您的电子邮件始终看起来完全符合您的要求。不幸的是，这是一种目光短浅的策略，可能导致的问题多于解决的问题。继续阅读以了解原因（以及您应该做什么）。

为什么你应该避免只有图片的电子邮件

可悲的是，纯图像电子邮件的好处并没有超过缺点。以下是您应该避免使用它们的一些原因。

它们可能导致交付能力问题

在制作您的电子邮件活动时，您的首要任务应该始终是可传递性。仅包含图像的电子邮件通常会直接发送到垃圾邮件文件夹，因为它们可能是诈骗者用来绕过为检测攻击性或欺骗性措辞而设置的文本过滤器的一种策略。

电子邮件的整体文件大小也会影响可传递性，如这篇关于 acid 文章的电子邮件所示，纯图像电子邮件比 HTML 电子邮件大得多。

它们可能加载缓慢——或者根本不显示

出于安全原因或保护用户免受潜在攻击性内容或恶意软件的侵害，一些电子邮件客户端可能默认关闭图像。如果您创建了一封仅包含图像的电子邮件，他们可能只会看到一堵破损的图像图标墙，就像这篇关于图像屏蔽的石蕊文章中显示的示例一样。

图片过多的电子邮件还会大大增加电子邮件加载所需的时间，这可能不利于用户参与。人们平均花 10-13 秒阅读一封电子邮件；这意味着如果图像加载时有任何滞后时间，那么您必须传达信息的机会窗口已经很窄，将会进一步缩小。

他们妥协的可访问性

视障人士在使用屏幕阅读设备解读纯图像电子邮件时会遇到更多困难。尽管电子邮件中的图像应始终具有与电子邮件内容相关的描述性替代文本，但它们并不意味着完全取代电子邮件文本。

它们未针对移动设备进行优化

如果您为桌面设计纯图像电子邮件，您的客户会眯着眼睛在他们的移动设备上看到它。另一方面，如果你设计它是为了在手机上可读，它在电脑屏幕上看起来会像卡通一样大。

它们不像 HTML 电子邮件那样可搜索

如果您发送一封电子邮件，其中包含联系人希望稍后参考的信息，例如优惠券或即将举行的活动，如果所有文本都是基于图像的，他们将很难在收件箱中搜索您的消息。

既然您已经了解不应创建仅包含图像的电子邮件的所有原因，那么在制作美观且有效的 HTML 电子邮件时，请牢记以下最佳做法。

创建 HTML 电子邮件的最佳实践

这是否意味着您应该避免在电子邮件中包含图片？一点也不！大多数资源建议使用 60/40 的文本与图像比例，以实现可交付性和最佳用户体验的最佳平衡。尝试使用这些策略来创建在显示或不显示图像的情况下产生影响的电子邮件。

尽可能减小图像的大小

您可以——而且应该——仍然在电子邮件中包含图像，但在将它们添加到电子邮件模板之前，它们的文件大小应该最小化。

要从 Photoshop 为电子邮件导出图像，请选择“文件”>“导出”>“存储为 Web”。对于像照片这样的不透明图像，JPEG 文件格式将允许比 PNG 更小的文件大小。对于需要透明度的徽标等插图图像，PNG 是理想的选择。

如果您无法访问 Photoshop，免费的在线图像压缩工具（例如 tinypng）可以帮助您将图像尺寸保持在最小水平。

使用实时文本

在大多数情况下，所有电子邮件措辞都应该是 HTML 文本，可以用光标选择并通过屏幕阅读设备阅读。虽然最初的网络安全字体列表是您最安全的选择，但某些收件箱可能会显示您的字体（例如，Gmail 将显示 Google 字体）。

您始终可以选择首先使用您的品牌字体，然后使用网络安全字体作为后备。通过在 CSS 中使用逗号，您是在告诉收件箱尽可能使用第一种字体，然后尽可能使用第二种字体，如果其他两种字体不可用，最后使用任何其他无衬线字体。

 <style=”font-family: 'KoHo', Arial, sans-serif”>

创建防弹按钮

防弹按钮是使用 HTML 而不是图像创建的任何电子邮件按钮。它们可以使用多种方法制作，包括填充、边框或矢量标记语言 (VML)。

这个防弹电子邮件按钮创建器可以帮助您轻松创建一个风格化的按钮，该按钮将在大多数收件箱（包括 Outlook）中精美显示。

将图像交换为 Gif 以获得最大影响

您可能会惊讶地发现动画 gif 的文件大小甚至比照片还小。这一切都归结为图像的复杂性和帧之间有多少像素变化。

本文提供了几种为您的电子邮件创建大小合理的 gif 的详细策略。其中一些技巧包括：

切割而不是褪色过渡
使用插图矢量元素而不是照片
使用叠加层来限制调色板

在电子邮件顶部包含“在浏览器中查看”链接

有些用户会更喜欢默认关闭图像，或者他们可能无法控制此功能，因为他们有一个内置安全功能的工作场所收件箱。

这就是为什么在您的电子邮件顶部包含一个“在浏览器中查看”链接总是一个好主意，这样联系人就可以看到最初设计的电子邮件。

使用文本元素而不是图像图标

尽可能尝试使用基于文本/CSS 的元素代替图像。例如，不要创建箭头图像，而是查看是否有包含箭头的网络安全字体。您可以在谷歌上搜索“ASCII”或“Unicode”后跟您的关键字进行检查。此图表显示了您可能不知道的所有符号，它们都是 Arial 字体系列的一部分。

使图像成为可选的强调元素

我们注意到的最近趋势是使用图像无缝融入纯色背景的电子邮件。这给人一种纯图像电子邮件的错觉，同时保留了桌面和移动设备的 HTML 文本和响应式设计。

尽管您可能无法选择理想的字体和布局，但精心设计的 HTML 电子邮件仍然是一种非常有效的营销工具，可用于接触每一位顾客——无论他们的人口统计群体或身体能力如何。