HTML 电子邮件按钮终极指南(第 1 部分)

本指南中,我们将探讨电子邮件按钮的定义并研究创建它们的基本知识。通过比较真实示例,您将深入了解颜色、文本和移动优化如何影响其有效性。

HTML 电子邮件按钮是成功的电子邮件营销的支柱之一。对我来说,它是网站页面的快捷方式,也是购物或阅读博客文章的鼓励元素。然而,收件人收到的电子邮件越多,他们就会变得越挑剔。有办法吗?有。

单单实现响应性就可以将点击率提高15%。可访问性、色彩心理学和文本选择可以进一步提高点击率。

那么,电子邮件按钮的秘诀是什么?如何设计它们,即使没有编码技能? 

我们将一起回答这些问题,比较不同按钮触发的情绪和动作,并学习如何使用 Stripo 创建 HTML 电子邮件按钮。让我们开始吧!

了解 HTML 电子邮件按钮

在学习如何创建电子邮件按钮 洪都拉斯数据 之前,我建议我们研究这些元素并查看它们的类型。 

什么是 HTML 电子邮件按钮?

HTML 按钮是使用层叠样式表或 CSS 样式化的可点击电子邮件布局元素。与文本元素不同,按钮非常显眼,让人无法忽视。

电子邮件按钮有各种形状,可用于 五大电子商务营销最佳实践 多 种用途。这就是差异化发挥作用的时候:

  1. 号召性用语或 CTA 按钮:此电子邮件按钮促使电子邮件收件人采取行动 – 购物、获得折扣、查看文章或预订会议 – 因此得名按钮名称。

    (来源:ConnectTeam 的电子邮件)

  2. 纯文本按钮:此电子邮件按钮的主要特点是它只使用文本,没有按钮式的样式元素。超链接文本通常用作取消订阅选项或将读者转发到政策和服务条件

    (来源:Travel Awaits 的电子邮件)

  3. 防弹按钮:此按钮的设计可确保在所有电子邮件客户端上正确呈现。关键在于它的形成——它使用 HTML 代码和内联 CSS 构建。即使邮件中的图像被禁用,这些按钮仍保持不变。有几种防弹按钮子类型可供使用: 
    • 填充按钮:此电子邮件按钮基于 HTML 表格,并使用 CSS 样式在文本周围添加更多空间;
    • VML 按钮:VML 代表矢量标记语言。这项技术特别用于制作 Microsoft Outlook 的防弹按钮;
    • 基于边框的按钮:您无需在实际的按钮表中添加填充,而是使用粗边框来定义其形状。

      (来源:瑞安航空的电子邮件)

  4. 基于图片的按钮:要创建基于图片的按钮,您需要代表按钮的图像文件(JPG、PNG 和 JPEG)。您可以尝试不同的样式或字体,但这种方式并不完全实用。仅基于图像的电子邮件加载速度可能会很慢。除此之外,如果禁用图像,按钮会从视图中消失,并且电子邮件无法正确显示

    (来源:Reserved 的电子邮件)

    现在,让我们看一下启用了基于图像的按钮的图片的同一封电子邮件:

    (来源:Reserved 的电子邮件)

  5. 社交媒体按钮:此类电子邮件按钮链接社交媒体资料,主要用于页眉或页脚。按钮较小,代表社交媒体平台。

    (来源:Brevo 的电子邮

了解按钮类型和优势是改善电子邮件营销活动的关键。现在,让我们讨论一下它们的实际影响。

你可能还会喜欢

按钮。为什么我们选择这种布局方法

为什么 HTML 电子邮件按钮很重要?

在电子邮件营销中,没有什么是微不足 学生手机清单 道的。HTML 电子邮件按钮可能看起来微不足道,但它们会影响参与度并创造积极的用户体验。如何?

精心制作的 CTA 按钮可以增加点击量371%并提高销售额 1617%。

对比色、清晰的文本信息和增大的字体使电子邮件按钮脱颖而出,并激励收件人完成操作。 

除了外观之外,HTML 按钮还可以使电子邮件更易于浏览,并且通常可以拆分冗长的文本。举个例子可能更有说服力。

您是否注意到下面的屏幕截图中两次使用了“Explore Adventure Fix GO”短语?没错!第一次,它在文本中被提及,第二次,它作为按钮文本。

(来源:Adventure Fix 的电子邮件)

一开始我只在按钮上注意到了这一点 — 仔细阅读文本后我才意识到它是重复的!按钮的强大功能和引人注目之处就在于此。

按钮信息总是能吸引眼球,因此精心设计的电子邮件按钮不仅仅是一个元素,而是一个工具。我建议我们转到设计,看看是什么让一些按钮变得很棒。

设计 HTML 电子邮件按钮 

制作按钮既是一门科学,也是一门艺术。它们必须可用、可访问、加载速度快且美观。虽然 HTML 按钮的外观可能是最先吸引眼球的东西,但可访问性让它适合所有人。 

未针对屏幕阅读器或残障人士进行调整的电子邮件按钮会从上下文中消失并让人不知所措。这就是为什么我们将讨论的下一个主题是可访问性。 

发表评论

您的邮箱地址不会被公开。 必填项已用 * 标注

滚动至顶部