为了更好的用户体验设计:我可以点击这个吗?

已发表: 2020-02-05

细微的变化如何提高您的点击率

每个人都想要更多的点击。 更多水龙头。 更多用户说“是的,我喜欢你给我的任何东西。” 我们想看看一些真正让用户想要点击更多的方式,这就是用户体验设计的用武之地!

它在整个网络上都贴得很好:当你让用户点击时,一个微妙的变化可能会有很长的路要走。 我们研究了这些细微的变化究竟是什么以及它们可能对您的转化产生的影响。

字体

字体可以产生疯狂的巨大影响。 例如,2009 年,Tropicana 大刀阔斧地更名,其中很大一部分是重做字体。 请记住,Tropicana 字体也是他们的标志。

tropicana 品牌重塑

图片来自重要设计

销售额迅速下降了 20%。

当你让人们点击时,字体也是你可以依赖的最稳定的东西之一。

通常,具有高对比度的粗体无衬线字体会做得很好。

为什么? 这是最容易阅读的。 这方面的例子遍布互联网。 Basecamp、BaseCRM、Evernote、mHelpDesk——所有这些公司都有相同的 CTA——高对比度、粗体无衬线字体。 很容易看到,很容易阅读。 这就是为什么公司倾向于使用它而不是衬线字体。 (海报也是如此——你可以从很久以前就读到它)。 此外,无衬线字体更容易在计算机上阅读,这就是为什么当您希望读者点击时要使用它的原因——他们需要先知道您在说什么。

印象笔记免费试用按钮绿色大本营免费 2 个月帮助台

阴影+ 3D效果

令人惊奇的是,投影和制作 3D 东西可以让人们点击它。 这确实是扁平化设计的一大缺点。 (目前。另一个是,最终,它会过时。)当事情真的很平坦时,它们看起来很棒,但它们并不那么容易知道什么是可点击的,什么是不可点击的。 Jakob Nielsen 在 2012 年评估 Windows 8 时讨论了这一点。

因为当事物实际上看起来像按钮时,人们点击的次数更多,圆角边缘或阴影可以很容易地知道什么是可点击的,什么是不可点击的。

(专业提示:这些被称为信息亭风格的按钮)。

按钮 这实际上提出了一个有趣的问题。 亭式按钮最初用于拱廊和其他地方。 因此,当我们走向数字化时,这种规范得以延续。 这是有道理的,但在某些时候,它们变成了斜角和 3D 按钮,因为它们是斜角 3D 按钮,而不是因为任何人都记得它们来自哪里。 就像软盘上的保存图标一样——拟态根最终会变得任意,不再是拟态。

所有这一切都表明人们现在更愿意点击信息亭式按钮,但如果扁平化设计可以再坚持几年,我们可能会看到稳步远离。

移动

很多人将移动与制作可点击 3D 的东西混为一谈,但我认为它本身就足以保证一个类别,首先从用户体验的角度来看,其次是因为它对平面设计意味着什么。

从用户体验的角度来看

用户需要对他们的行为进行反馈。 这是帮助用户了解他们在哪里以及做什么的第一方法。

使某些东西可点击的首要任务是告诉用户它可以被点击。

例如,当涉及到按钮时,只需最轻微的渐变变化就可以创造奇迹。 例如,Eventbrite 主页在其图标上使用轻微的渐变变化来显示它们是可点击的,并强化用户所在的位置:

Eventbrite

另一个很好的例子是 eTecc/Interactive 的网站主页。 他们实际上使用 aa 填充来让用户知道某些东西是可点击的。

这是一种非常简单的方法来弄清楚如何通知用户什么是可点击的,什么是不可点击的。 随着事情变得越来越平坦,这种视觉反馈变得越来越重要。 奇怪的是,这是苹果可以改进的地方。 查看 Apple.ca 主页。

看起来顶部的链接是可点击的,确实如此,并且有一个小的渐变变化来重申用户的知识。 我们还可以假设查看画廊选项也是可点击的,并且再次有颜色变化来加强这一点。

苹果主页2

但问题是整个屏幕实际上是可点击的! 这对用户来说非常不直观,作为碰巧点击很多的人,我花了一段时间才弄清楚为什么页面不断变化。 它根本不是一个直观的 UI。

可点击的屏幕苹果

从平面的角度

只是有创意 因此,尽管 Apple 并没有 100% 地做到这一点,但它们已经非常接近了。 移动可以让设计师构建他们想要的平面界​​面,同时让用户知道什么是可点击的,什么是不可点击的。 注意到所有的例子都是非常扁平的设计吗? 完全披露是我计划的。 它说明了扁平化设计可以用于按钮,只要有反馈。

这是一个没有反馈的扁平(ish)设计的例子——虽然我很清楚它是一个按钮,但没有反馈它确实感觉有点像我的电脑不工作。

对比度+颜色

可悲的是,没有一个特定的 RGB 代码可以保证人们点击。 但是有一些很好的规则可以帮助你。 如果您希望用户点击某些东西,您希望它能够脱颖而出。 这意味着您需要它与周围的任何其他事物形成鲜明对比,即使这意味着打破品牌的调色板。

例如,David Hamill 建议对不用于其他任何内容的超链接使用颜色。 在他的网站上,每个链接都是粉红色的。 用户很容易知道什么是链接,什么不是。 结合将鼠标悬停在其上时的更改,当您可以单击某物时,对用户来说非常明显。

大卫·哈米尔

这种颜色和对比度问题最常出现在号召性用语 (CTA) 和按钮上,颜色的微小变化可以带来巨大的利润变化。 例如,Vibethink 撰写了有关 CTA 和按钮的文章,并报告说更改按钮的颜色和形状可将转化次数(阅读:点击次数)提高 35%。 他们认为增加的对比度使用户更容易点击。

氛围思考

但是他们改变了两件事,所以这不是绝对科学的。 Hubspot 在 2011 年发布了一些对红色和绿色按钮的 A/B 测试结果,发现红色按钮的性能比绿色按钮高 21%。

中心点

因此,颜色和对比度可以在让用户点击内容方面发挥重要作用。

包起来

魔鬼在细节中。 作为设计师、开发人员、UX 人员和营销人员,每当我们制作可点击的东西时,我们都是在要求用户做某事。 点击这里。 提交申请表。 联系我们。 立即购买。 不管是什么,这是我们需要的他们拥有的东西。 那么为什么不简化呢? 帮助您的用户点击(并因此可能对您有所帮助)的最佳方式是使其易于点击。 通过使按钮符合信息亭风格设计的期望,通过使字体在屏幕上易于阅读(即使它们很小),并通过提供有关按钮和可点击内容的反馈,您可以让用户的生活更轻松。

就是这样,真的。 当您制作可点击的内容时,同时让用户的生活更轻松。

喜欢这篇文章吗? 您可能还想阅读我们的了解您的用户以改善您的网站 UX 设计帖子或我们的每个 UX 设计师都应该拥有的伟大产品