Jillian

小编:转化率是每一个网站都非常关注的重要指标,设计的好坏会在很大程度上影响网站的转化率。设计是要为商业目标服务的,俗话说,不能提高转化率的设计不是好设计。那么作为设计师,我们需要在设计上做哪些“手脚”来帮助提升转化率呢?本文从交互和视觉两个方面为我们提供了很多好的建议。而所有这一切的核心其实就是:以用户为中心。

有很多公司雇佣我来帮助提高他们网站的转化率。有时候,他们潜在的想法就是主要问题就存在于某个单一的,孤立的元素上,比如CTA按钮(注:CTA:call to action,行为召唤)。他们要求我提供一个解决方案,然后会进行A/B测试,如果效果好的话就正式实施。

A/B测试对于CRO(转化率优化)来说非常重要(CTA按钮也是一样),但是它需要在一个更综合性的方案中采用。这个方案就是以用户为中心的设计,这是我认为提高转化率最好的策略。

以用户为中心的设计是一种方法论,是一个将关注点放在用户上的很大的流程框架。它不仅包含了用户界面设计,还包括一些行为比如用户研究。它的目的是创造一个围绕用户的需求,欲望和限制而形成的产品,而不是强迫用户去适应它。

user centered design

                                                             什么是以用户为中心的设计

把这些行为都考虑进去的转化率优化的策略是值得推荐的,也是最佳的解决方案。但是通过直接根据以用户为中心的设计原则修改界面也可以为转化率带来很重要的提升。

清除障碍

交互问题是转化道路上的障碍,需要清除掉。他们通常属于这些范畴:缺少反馈,疑惑和用户疲劳。总体的目标是要最小化认知负荷——为了使用网站,界面强加给用户的脑力劳动的数量。

我们来看一下一些常见的问题以及如何消除它们,为转化的道路扫清障碍。

视觉混乱

界面上那些并不能帮助用户实现他们的目标(以及你的商业目标)的元素都是不利的。它们是使用户分心的根源,并且需要增加额外的努力将它们从有用的元素中区分出来。

在任何特定的情景下都只展示需要的信息。避免那些不能带来价值的颜色、图片、链接或者布局。在元素间要有充分的留白。

whitespace example Google homepage

                                                                 谷歌中留白的良好运用

步骤

转化的过程中包含一系列步骤。好的解决方案需要使步骤达到最少。而更好的方案需要的是让步骤少且简单。应该采用的方案是减少整个过程的脑力劳动,而不是为了减少步骤的数量却增加了脑力劳动。

内容

太多的文本会将用户淹没,令其反感。遵循以下这些指示来做:

  • 省略掉无用的东西:用所需的最少数量的文本来传递你的信息。
  • 使文本易读:运用良好的对比,足够大的字号,较短的行宽,短的句子和段落,尽量少的模块且中间要有足够的留白。
  • 创建对话:用“你”来与你的用户对话,回答他们的问题(他们来你的网站的目的),并且要避免使用专业术语。
  • 在内容中插入图像:图片,插画和图表通常是能够更快更清晰地传达信息的一种有效的方式。

链接

如果链接的锚文本表意不清,用户可能不会点击链接,因为他们不确定接下来会发生什么。写上有意义的链接,表明用户将会看到或得到什么。运用动词来引发用户的行动。

表单

表单是非常关键的。遵照以下这些说明来做:

  • 减少用户疲劳:将用户需要填写的区域的数量降到最少。只询问你真正需要的信息(去掉选项栏)。每一个额外的栏目都会增加用户疲劳并对转化率产生消极的影响。
  • 有逻辑地分组:将相关信息划分为一组。
  • 给予反馈:在一个多步骤的表单中,清晰地标明每一个步骤,让用户从一开始就能洞察到整个过程。当一个步骤完成时给予高亮显示以表明进度。
  • 避免疑惑:在下拉菜单中,答案选项应该包含所有的可能性而不需要再强加一个选项。如果需要的话加上“其他”的选项。

在线客服

用户在你的网站上完成任务的时候有时会有疑惑或者需要及时的帮助(比如填写表单时)。如果他们找不到答案就会离开。在线客服支持可以节省转化的次数,防止用户散播负面的评价,同时可以让你发现用户的痛点,便于进一步提升。

触摸区域

手机习惯上地会遭遇低转化率的困扰。理解不同的设备拥有不同的使用模式是很重要的。当为手机进行设计时,最关键的就是要始终保持简洁。减少文本的数量并在界面上的元素间引入更多的留白。

简化表单,“考虑拇指”而不是像素。去除掉或者替代复杂的视觉元素以提升网站的加载速度。

The Thumb Zone

                                                     拇指热区(来自SmashingMagazine.com

使界面具有说服力

视觉设计

视觉设计是你的网站制造的第一印象,并且会对用户是否相信网站的可信度具有很大的影响。用户更有可能对一个有吸引力的应用产生信任并在上面花更多的时间。可以利用视觉上的暗示给予任务优先级,并将用户的注意力吸引到想要展示的功能上。

在优秀的,专业的摄影和插画上进行更多投入,善于利用配色和排版,并遵从留白的原则。

The creative process

价值定位

价值定位是关于你的产品或服务如何使你的用户从中受益的陈述。使你的价值定位清晰,明确,并且可见。让用户确信他们选择了正确的网站,并且你会履行你的承诺。

CTA

“行为召唤”按钮的设计对于实际效果有着非常大的影响。你的目标就是避免用户头脑中产生疑惑并且减少阻力:

  • 让它看起来像一个可点击的按钮,并用颜色和大小来强调它。在按钮周围设置留白。
  • 行为召唤按钮是为了激发用户的行动。文本需要简短并以动词开头。运用用户会使用的词汇并且清晰地表明用户点击后会得到什么。
  • 当为移动设备设计时,不要仅仅只调整页面的大小。让CTA按钮足够大,可以很容易地点击到,并在周围增加更多的留白(按比例适当地增加)。
  • 避免“广告盲区”效应。确保CTA按钮非常突出,但仍能和网站整体的设计相符。保持简洁。
  • 避免选择过载并给予选择优先级。如果有多个你想要引导用户去采取的行动,为它们安排优先级。明确哪一个是与你的商业目标相符的最重要的行为。
  • 点击CTA按钮之后的内容也是同等重要的。保持一致性,始终让事情简化并避免干扰。

结论

转化率优化不应简单地关注孤立的元素,而是需要采取一个综合的方式来实现更好的效果。以用户为中心的设计原则向我们表明设计上的决策对于提升转化率是非常重要的。

 

原文地址:Speckyboy

原文作者:Mauro Pellegrini

译文作者:学ui网翻译部-Jillian

转载请注明:学UI网 » 如何设计才能提高网站的转化率?

登录收藏

学UI就上学UI网!越努力,越幸运!

“学UI网www.xueui.cn ”最值得关注的UI学习平台! 每天发布高质量的设计教程和分享设计经验,服务于20万UI设计师,帮助初学者快速转型。每周六晚上免费YY公开课(36013311),给大家提供更多免费学习的机会。想成为设计师的你快来关注吧!

【特色推荐】

APP截图站app.xueui.cn” 海量APP截图,让你灵感爆发!国内最好的APP截图站。

UI作业网 zuoye.xueui.cn” 每一个作业题都尽量配有教程,交作业就有大神免费帮你点评作业,爽歪歪!

UI设计导航站 hao.xueui.cn” 专为UI设计学习者打造的资源+学习,双用途的网址导航站。亲爱的,你收藏了吗?

【学UI网 原创文章 投稿邮箱:tougao@xueui.cn,也可以找各个群的管理】

 
你可能喜欢的:
那些你想太多的“过度设计”真不必要存在那些你想太多的“过度设计”真不必要存在
2018你不能忽略的顶尖UI界面布局趋势2018你不能忽略的顶尖UI界面布局趋势
2018年公司到底想要什么样的交互设计师?2018年公司到底想要什么样的交互设计师?
这5个排查法让你的作品更瞩目!这5个排查法让你的作品更瞩目!
滴滴设计团队:Web端布局框架的思考与设计经验滴滴设计团队:Web端布局框架的思考与设计经验
网易设计师述说:被点赞的调研需经何历练?网易设计师述说:被点赞的调研需经何历练?
《网页设计综合指南》(三):网页设计看这篇文章就够了《网页设计综合指南》(三):网页设计看这篇文章就够了
版式系列:横版大配图中,主体提取的应用版式系列:横版大配图中,主体提取的应用
《网页设计综合指南》(二):网页设计看这篇文章就够了《网页设计综合指南》(二):网页设计看这篇文章就够了
版式系列:关于横版大配图的应用版式系列:关于横版大配图的应用