如何设计万无一失的链接和 CTA

您是否曾经查看过您的网站统计数据并想知道：“为什么人们不去我希望他们去的地方？”

他们为什么不访问您的产品页面？ 他们为什么不进行任何购买？

在这篇文章中，我将分享一些专家提示，可以帮助您控制访问者在您的网站上的进度。

确定问题

首先，我们需要确定问题可能是什么。 有用的工具（例如 Google Analytics）可以为您提供有关您网站的大量统计信息，但我发现更多的可视化工具，例如 Crazy Egg、Heatmap.com 和 Inspectlet，确实可以帮助您准确定位您网站中的问题所在。网站谎言。

拥有像热图这样的视觉参考框架可以立即向您展示吸引观众注意力的内容。 当与滚动图结合使用时，它特别有用，它可以告诉您页面访问者正在看多远！ 有时，问题可以快速而容易地纠正，但有时并不那么清楚。 希望这些提示将帮助您改进网站并实现更多目标。

解决方案

明晰

尽管听起来很愚蠢，但有时问题可能很简单，因为客户一目了然不知道什么是链接，什么不是。 虽然这对您自己和其他人来说似乎很明显，但我们必须记住，每个人的运作方式都不同，他们可能会以不同的方式查看您的网站。

例如，您网站上的宣传图片可能会使您难以确定访问者应该点击的位置。 这是 downloads.cnet 和 filehippo.com 等网站上非常常见的问题：

在这方面，Download.cnet.com 和 filehippo 一样糟糕。 您是否首先看到了下载链接或页面顶部明亮的橙色和蓝色大横幅？ 在这种情况下，它只会将您带到该公司的网站，但另一个网站可能会将您带到任何地方。

他们怎么能解决这个问题？ 简单地把它说得更清楚会立即解决这个问题。 他们需要将他们的链接与试图误导人们的广告分开。 一种方法是在标题和随后的下载链接周围添加一个明显的大边框，甚至是完整的背景颜色和间距以进一步强调标题和下载链接。 即使像指向下载链接的箭头这样简单的东西也会产生奇迹！ 任何能让他们的链接快速从其他链接中脱颖而出的东西，从而减少任何“错过的点击”。

风格

另一个问题可能是您的链接和 CTA 的样式。 现在，在造型方面没有对错之分。 这一切都取决于什么适合您的设计和网站，您觉得什么看起来最好，以及什么最适合您的观众。

话虽如此，您可能已经注意到，在过去几年里，在“空白”的广阔海洋中，大而明亮的按钮大量涌现。 这种趋势有很好的理由。 研究和统计数据表明，访问者更有可能参与这些类型的链接，可能比其他变体更多：

但这是为什么呢？ 为什么作为用户，我们被吸引到很少有交互元素的网站，而不是有很多途径和链接可供探索的网站？

很简单：这不仅消除了任何混乱，而且样式使可点击和不可点击变得非常简单明了。 CTA 和注册/登录按钮引起我们的注意并邀请我们点击它们。

但这是否意味着我们所有的链接都应该是明亮的大按钮？

一点也不。 我们只想突出我们的“号召性用语”，即我们希望访问者参与的链接——我们认为，这将以某种方式使他们和我们受益，例如促销销售页面或最新消息故事。

回到 PayPal 的例子，可以将纯文本链接用于更标准或不太重要的链接，只要它们仍然是指向某物的非常明确的链接。 在过去，它总是用带下划线的文字表示，今天我们仍然可以使用它，只要它适合设计——尽管有些人觉得带下划线的链接在现代设计中几乎没有地位。

例如，查看 PayPal“了解更多”链接下方的文字，“不是 PayPal 客户？ 开始。 ” 通过简单地强调最后两个词，吸引了参观者的注意力，并巧妙地鼓励他们进行互动。 “这段文字是不同的，”他们认为。 “有东西吗？ 为什么那一点是粗体的，而其余的不是？” 这会邀请用户将鼠标悬停在它上面并发现它是一个链接！

这是一个简单的区别，但在一个我们必须为用户的每一秒注意力而战的世界中，这是一个可以导致点击的差异，而且它可以很容易实现。 看看什么最适合您的网站和您的客户。

屏幕上的位置

用户几乎没有时间在网站上搜索链接，而浪费的时间越多，就会导致更多人离开您的网站。 那么我们怎样才能避免这种情况呢？ 同样，我们只是让用户可以尽可能轻松地识别链接。

滚动图在这里可以提供巨大的帮助。 根据我的经验，几乎所有页面的访问者都会看到页面的最顶部，但只有不到 20% 的人会一直滚动到底部——对于更长的页面，甚至更低。 然而，超过 80% 的人会看到页面的前 50%。

除了屏幕分辨率和设备尺寸之外，屏幕尺寸在这方面发挥着重要作用。 但是，这确实意味着您的访问者可能看不到显示器底部下方的任何内容。 因此，理想情况下，我们希望确保我们宝贵的 CTA 位于页面的高处。 问题解决了对吧？

这对于经验法则来说是一件好事，尤其适用于单一产品和促销活动。 但是，例如，当您比较产品的搜索结果时呢？ 您将有许多对象争夺访问者的注意力。

在这里，您需要在设计中将三件事结合在一起：清晰度、风格和位置。 要记住的关键是，如果屏幕上的信息太多，用户会很快失去兴趣。 如果你有很多产品要展示，你想给他们提供你能负担得起的最少信息——最好是标题、价格和“更多信息/立即购买”CTA。

由您决定还包括哪些内容。 但是对于设计的好例子，看看像 Tesco 这样的大型超市网站：

简单搜索“面包”会产生数百种不同的产品，但 Tesco 为所有产品提供了足够的空间，并将购物过程简化为“数量？” 和“添加”。

您可能还会注意到按钮遵循所有规则：它们很清晰，它们的间距和样式都很吸引人，并且它们逻辑地出现在网格上、产品下方以及它可能具有的任何描述上。

四处搜索其他示例，看看大型电子商务网站在展示多个 CTA 时会做什么，您可能会对所发现的内容感到惊讶！

概括

希望这篇博客能让您深入了解可以真正帮助提高网站成功率的简单技巧。 总之，在创建链接和 CTA 时您需要记住的是：

• 清晰度。 确保您的 CTA 从页面上的任何其他内容中脱颖而出，尤其是当其他链接和按钮可能会引起混淆时。 您应该能够立即区分真假。

• 风格。 人们被明亮的大按钮所吸引，而我们被吸引我们注意力的大文本字段所吸引。 用户识别链接或按钮所需的努力越少，他或她点击它们的可能性就越大。 这适用于较小的、不太重要的链接——您永远不想丢失文本或图像中的链接，因此就如何设计链接和 CTA 设置严格的指导方针。 使用粗体、不同颜色或其他东西来突出显示和区分您的可点击和不可点击。 只要确保它们被一致地使用。 同样，除非您有充分的理由，否则请确保您的所有图像都没有包含这些元素。

• 位置，位置，位置。 您放置链接和 CTA 的位置很重要。 如果您非常有价值和重要的“立即购买”链接没有显示在某人的首屏上方，那么客户点击它的可能性不到 50%，因为只有不到 50% 的用户会向下滚动到这里。

我希望这个建议有帮助！ 不要忘记总是四处搜索，看看其他人正在做什么来解决这个问题，并将他们的网站与您的网站进行比较，看看您的网站在哪里以及如何进一步改进。