建站教程

建站教程

Products

当前位置:首页 > 建站教程 >

超级有效的移动号召性用语按钮的 12 个最佳实践

GG网络技术分享 2025-03-18 16:05 3


目前全球有超过 66 亿智能手机用户。 即使您的网站只吸引了这些全球用户中最微小的部分,我敢打赌有很大一部分移动访问者构成了您的整体网站流量。 我为什么这么说? 因为仅在美国,智能手机用户平均每天上网 3-5 小时。

假设该统计数据针对您的目标人群。 如果是这种情况,这意味着您拥有智能手机的观众几乎花费 三个小时 每天都用手机上网。 如果您已经完成了针对移动和搜索优化您的网站的工作,那么理想情况下,您的网站会在每天这三个小时的时间范围内的某个时间点引起他们的注意。

现在的问题变成了:您的网站准备好转换这些智能手机用户了吗?

最近,我写了一篇关于如何在您的 WordPress 网站上以最佳方式放置号召性用语的研究。 虽然我简要提到了桌面和移动 CTA 放置之间可能存在的差异,但没有太多证据可以明确证明两者之间存在明显差异。 话虽如此,我们确实知道移动 CTA 具有桌面 CTA 所没有的其他定义特征。

您如何看待我们更深入地探索如何专门为您的智能手机访问者优化设计 CTA?

继续阅读,或使用以下链接跳转:

  • 轻松复制
  • 诉诸情绪
  • 检查搜索结果
  • 考虑下一步
  • 记住拇指区
  • 限制选项
  • 坚持页面
  • 利用空白
  • 明智地使用颜色
  • 记住安置指南
  • 放大,当有疑问时
  • 用宽度获得创意

为 WordPress 设计适合移动设备的 CTA

当涉及到为智能手机用户设计号召性用语这样具体的事情时,我喜欢首先反思我自己的个人经历。

你有没有…

由于文本、图像和其他设计元素过于杂乱,难以在页面上找到 CTA?

是否对链接页面感到不知所措,无论是您现在需要填写的多页表格,还是您真的只想通过电子邮件发送给您的太小而无法阅读的 PDF?

试图点击一个网站的按钮,却不小心点击了附近的另一个链接或按钮?

然后你就知道当你想要做的就是点击那个 CTA 是多么令人沮丧,但是这么多糟糕的设计选择让你无法这样做。 以下是我的 12 条建议,可确保您在访问者有机会转化之前不会失去他们的兴趣。

提示#1。 轻松复制

Match.com 的 CTA 显然希望您点击查看谁是单身。
Match.com 的 CTA 显然希望您点击查看谁是单身。

除非您的 WordPress 网站仅从事提供博客和文章内容的业务,否则访问者很可能会出现快速行动计划。 他们想知道您商店的营业时间吗? 他们需要快速查找产品吗? 人们通常想通过手机即时购买什么东西吗? 一般来说,最好始终保持消息传递简短。 对于移动 CTA 及其周围的描述性文本尤其如此。

提示 #2。 诉诸情绪

Grubhub 用美味的图片和你可以在附近订购的诱惑来引诱你。
Grubhub 用美味的图片和你可以在附近订购的诱惑来引诱你。

同样,重要的是要设身处地为访客着想。 智能手机通常等同于“便利”,因此请在您的 CTA 消息中利用这一点。 不要强迫任何人玩猜谜游戏。 使用行动词来准确地告诉他们该做什么以及如果他们这样做会立即发生什么。 如果这样做更有意义,您可以尝试吸引他们当前的情绪状态。

提示#3。 检查搜索结果

Cuba Libre 定制了其移动网站,以帮助网站访问者寻找其餐厅的特定位置。
Cuba Libre 定制了其移动网站,以帮助网站访问者寻找其餐厅的特定位置。

没有花太多时间在 Google Analytics 上? 如果您想改善移动用户的用户体验,您绝对应该这样做。

你可以做到这一点的一种方法——这也将帮助你创建超级有吸引力的 CTA——是通过研究来自移动搜索和网站搜索栏的关键字。 这些关键字可以帮助您确定智能手机访问者首先希望看到的内容。 然后,您可以设计 CTA,将它们直接带到您网站的那个位置,而无需滚动或挖掘导航。

提示#4。 考虑下一步

Evernote 鼓励访问者将其软件的副本下载到他们的手机上,但您可能需要为自己的访问者考虑其他选择。
Evernote 鼓励访问者将其软件的副本下载到他们的手机上,但您可能需要为自己的访问者考虑其他选择。

这不仅仅是设计一个引人注目的 CTA,而是让奖励物有所值。 始终考虑智能手机用户点击您的 CTA 后会发生什么。 虽然他们可能很高兴获得免费下载,但他们将如何处理手机上的电子书 PDF 呢? 与其希望他们能够像在台式机上一样采取后续步骤,不如给他们另一种选择(例如电子邮件)。

提示 #5。 记住拇指区

Kissmetrics CTA 很容易用拇指触及。
Kissmetrics CTA 很容易用拇指触及。

用户体验设计师 Steven Hoober 在 2013 年进行了一项研究,确定了移动用户与手机交互的最常见方式。 除了记录拨打电话和听音乐的百分比外,最有趣的观察来自用户通常如何握住他们的设备。 这导致了“拇指区”的出现——手机上拇指最容易触及的位置,因此最常被人们使用。

虽然您无法解释所有三个最常见的抱抱姿势,但您可以在放置 CTA 时注意那些拇指“触摸”活动的热床。

提示 #6。 限制选项

Hubspot 的移动网站很简单,会引导用户点击 CTA。
Hubspot 的移动网站很简单,会引导用户点击 CTA。

一般来说,最好的做法是限制访问者必须在您的网站上做出的选择数量。 选择太多,您将面临选择悖论破坏和平的风险。 因此,在规划移动 CTA 的放置位置时,我建议您尝试将其保留在任何给定空间内的一个 CTA 中。 您已经在使用有限的房地产,因此如果您不需要,请不要使决策过程复杂化。

提示 #7。 坚持页面

Buzzfeed 将其社交媒体 CTA 粘贴到页面底部,拇指触手可及。
Buzzfeed 将其社交媒体 CTA 粘贴到页面底部,拇指触手可及。

除非您有一个绝对需要在定时或有针对性的弹出窗口中提供的 CTA,否则我建议您采用更简单的交付方法:将所有 CTA 直接保留在页面上。 您甚至可能希望将它们“粘”在移动屏幕的底部,这样,无论访问者走多远,采取行动的呼声始终与他们同在。

提示 #8。 利用空白

Asana 的移动网站使用了大量的空白,而 CTA 是非常明显的焦点。
Asana 的移动网站使用了大量的空白,而 CTA 是非常明显的焦点。

我们已经知道,整理是良好网页设计的必要条件。 正如您可以想象的那样,这对于在您的智能手机访问者必须查看的最小空间内引起对您想要单击的按钮的注意尤其重要。

在您的 CTA 周围留出足够的空白以引起人们的注意; 空间过于分散注意力或杂乱可能对您不利。 您也不希望用户在尝试单击按钮时感到沮丧,而只是反复(并且意外地)点击使用条款链接或附近的其他一些可点击内容。

提示 #9。 明智地使用颜色

WordPress.com 使用有限的调色板。
WordPress.com 使用有限的调色板。

一般来说,您在网站上用于 CTA 的任何内容都应该适用于移动访问者。 如果您需要了解 CTA 适合哪种颜色,请查看本色彩心理学指南。

提示 #10。 记住安置指南

Netflix 的 CTA 突出显示在屏幕底部。
Netflix 的 CTA 突出显示在屏幕底部。

提醒一下,这就是我能够挖掘出的关于 CTA 最佳位置的研究。 我建议您不仅要注意桌面与移动的结果,还要注意其他结果,因为顶部与底部和左侧与右侧仍然是移动体验的因素。

提示 #11。 放大,当有疑问时

亚马逊的按钮符合最低准则。
亚马逊的按钮符合最低准则。

如果您想知道为移动设备制作 CTA 的尺寸,Apple 可以解决这个问题,这是一个被大量引用的统计数据,我建议不要偏离它太远。 Apple 推荐的用于触摸屏转换的最小 CTA 大小为 44 x 44 像素。 这并不意味着您需要方形 CTA,这些只是他们建议的最小参数。

提示 #12。 用宽度获得创意

在 WPMU DEV 网站的移动版本上,我们使用全角 CTA。
在 WPMU DEV 网站的移动版本上,我们使用全角 CTA。

我想说你可以考虑这最后一点是可选的,因为你的网站的整体设计将决定这在美学上是否有意义。 但是,如果您可以将移动 CTA 设计为拉伸屏幕的整个宽度,请考虑访问者错过它或试图掩盖它的难度。 它周围没有任何东西可以分散注意力。 只是你的内容,然后砰! 呼吁采取行动。

包起来

我知道我最近经常谈论号召性用语,但这是有道理的,对吧? 没有它们,您必须相信访问者会阅读您的所有内容并决定自行联系或采取下一步行动……我们知道这不会发生。

因此,如果您发现移动访问者的百分比在增长并希望推动他们完成转换过程,请注意这些建议。 然后观察他们在移动设备上的体验的改善以及您的转化次数的增长。

标签:

标签: WordPress op

提交需求或反馈

Demand feedback