提高网站转化率的 10 个真正有效的网页设计技巧
已发表: 2018-02-05聪明的营销人员知道,网页设计可以提高或降低转化率。
尽管 SEO 和社交媒体营销对转化至关重要,但拥有出色的设计可以让一切变得不同。
所有数字营销组件都很重要。 但是,网页设计可以决定或破坏转化率。 在斯坦福大学的一项研究中,46.1% 的人表示,他们区分公司是否可信的首要标准是网页设计。 考虑到这一点,您的网站设计至关重要,而且它必须看起来很专业。
美观
您网站的美感也可以在转化中发挥作用。 根据 Adobe 的一项研究,如果网站设计精美,三分之二的人会消费内容并留下来。 也就是说,如果您希望访问者阅读您的帖子,您的网站必须看起来很有吸引力。
在这种情况下,您不能忽视网页设计。 您可以聘请自由职业者或聘请设计师来确保您的网站美观。
以下是一些网页设计技巧,可以为您带来可持续的转化率提升。
1. 参考希克定律
法律规定,通过增加选择的数量,它也增加了个人做出决定所需的时间。 这个法则在网页设计中经常被提及。 在这项研究中,研究人员发现更多并不总是更好,因为一张展示较少种类果酱的桌子比一张有 24 种果酱的桌子吸引了更多的人。 当人们看到一个小显示器时,他们可能会购买。
要将法律应用于网页设计,您需要限制访问者的选项数量。 在您的网站上,评估导航栏中的内容。 这是寻找可以摆脱的东西以减少选择数量的最佳去处。 您的访问者可以选择的链接越多,您的用户就越会对您的网站失去兴趣。
除了导航栏,您还应该查看网站上的其他元素,访问者必须决定他们何时访问您的网站。 其中包括确定是否允许读者向下滚动页面或使用导航栏; 决定下载您的电子书或在社交媒体上分享您的帖子,或者选择阅读产品评论或浏览更多产品。
因为您的网站上可能有很多地方可以减少选项的数量,所以您可能希望在您的主页上安装一个欢迎门。 在这里,您的访问者将看到一条覆盖整个屏幕的欢迎消息,并带有一个号召性用语。 考虑到这一点,访问者在访问您的网站时只有一种选择。 如果他们希望看到更多选项,他们可以向下滚动,从而最大限度地减少您主页上的干扰。
然而,当你应用这条法律时,你必须考虑对你的底线至关重要的行动。 请记住,您网站上的每个页面都必须实现一个主要目标。 再说一次,访问者的选择越少,他们就越容易使用您的网站,这可能会提高您网站的转化率。
2.加快您的网站
您的访问者在网上冲浪时很不耐烦。 第二次延迟可能会导致转化率降低 7%。 有几种工具可以检查您的页面速度并了解有关其问题的更多信息。 您可以使用 Google 的 PageSpeed Insights、SEO Chat 和 Pingdom 的页面加载速度分析器等。
请记住,您有八秒钟的时间来引起读者的注意。 在这种情况下,登陆您的网站后,您有一点机会吸引访问者。 如果您的网站加载缓慢,他们就会离开并且永远不会回来。
除了加快您的网站速度外,您还应该考虑使用简短的标题、醒目的图片来传达您页面的目的或将访问者的目光吸引到主要的行动号召上。 确保您的注册按钮大而简单。 并确保您的副本具有吸引力。
3.遵循这个摄影原则
三分法则是网页设计师可以实施的摄影原则。 在这条规则中,你需要将你的网页分成三等份,这样它就会给你九个大小相等的正方形。 中间的四个广场是名胜古迹。 您在这些位置放置的任何对象都会对您的网站产生巨大影响,从而提高转化率。
您可以将最重要的号召性用语按钮放在这些区域。 但是不要把你的导航栏放在那些地方。 通过这种方式,您的访问者将专注于您网页上的主要号召性用语。
无需重新设计整个网站。 相反,您可以使用三分法来放置网站最重要的部分。 首先,您需要在首屏截屏您的网站。 然后,将其分成九等份。 从那里,您可以决定是否要调整您的网站。
在这些区域中,您可以放置您的视频、音频和其他互动内容。 考虑在您的号召性用语按钮上设置悬停效果。 这样,您的访问者将更容易点击。 然后,添加一些动画退出弹出窗口。 当访问者失去兴趣时,它们对于重新吸引访问者至关重要。
4.利用负空间
负空间是网页设计中的空白。 这个空间是一件好事,因为它使您的网站更具可读性和可用性。 这个空间不仅仅是页面上元素之间的空间。 相反,它也指页面上小元素之间的空间,例如段落或文本行之间的区域。
您必须注意您网站上的负面空间,因为它们使您的网站看起来很容易,从而提高了转化率。 根据您的网页设计,您可能会在主页上使用大量的负空间。 这样,您的访问者将专注于主要的号召性用语。
为了有足够的负空间,您可以使用较小的字体在字母之间留出更多空间。 然后,行高应该是 1.5。 如果您选择使用较小的字体,则应该有更多的行高。
然后,将这些大块文本分成更小的段落,以增加段落之间的负空间,从而使帖子更具可读性。 不要忘记使用边距和填充在您网站上的大元素之间添加空白。
5.摆脱滑块或旋转木马
为什么? 它们只会损害您的转化率。 他们以前很兴奋。 但是现在,它们变成了宠物岩石。 此外,由于使用了大图像,滑块会减慢您的网站速度。 它们也会分散注意力,因为它们不允许访问者消费您的内容。
由于人眼对环境的反应,这些元素令人困惑。 人脑旨在检测静态景观中的运动。 过去,在苔原上追踪猛犸象很有帮助。 但是这种反应使人们更加关注滑块的移动,而忽略了您希望他们关注的转换点。
此外,当您的访问者通过移动设备浏览您的网站时,滑块将毫无意义。 这就是为什么人们发现滚动比滑动更容易的原因。 请记住,访问者更容易使用移动设备浏览您的网站,这将为您带来更高的转化率。
滑块也会导致您网站的 H1 标签过多。 您可能认为它们对您的网站非常有用,但网络爬虫却鄙视它们。 原因是它们混淆了您网站上的信息层次结构。 因为网络爬虫讨厌它们,它们会显着影响您的页面排名。 因此,请确保尽可能避免它们。
不要使用滑块,而是选择具有有力标题的静态图像。
6. 考虑 F 模式
在各种研究中,研究人员发现大多数用户浏览网页以阅读 F 模式的帖子。 也就是说,他们在屏幕顶部从左到右看。 之后,他们向下扫描页面并阅读内容。 他们很少到达页面的右下角。
如何使用 F 模式来提高转化率? 沿着 F 形线放置那些关键的行动号召和对象。 然后,将那些不太重要的对象插入到能见度低的区域。
由于页面左侧是访问者首先查看的位置,因此请考虑将主要的号召性用语放在该区域。 然后,将标题放在页面左侧。 现在,对于您的赞助广告,您可以将它们放在页面右侧的侧边栏中。 任何不需要可见但对网络爬虫来说必不可少的东西都应该放在页面的右下角。
7.选择正确的颜色
由于颜色可以唤起情感,因此您必须选择能够传达品牌个性并促使人们采取行动的颜色组合。 请记住,人们会从情绪化的地方做出购买决定。 也就是说,您为网站选择的颜色组合将在优化转化率方面发挥重要作用。
一个建议是策划一个 Pinterest 板,其中包含一些反映您品牌愿景的照片。 使用 Adobe 的色轮根据这些照片中的颜色创建配色方案。 但是您可以通过移动选择来推特各个颜色。
创建配色方案后,请确保使用对比度,因为它也可以实现或破坏您的转换。 对比度可用于使标题、文本和号召性用语按钮更具可读性和显着性。 正面和按钮颜色必须与背景和您希望突出显示的其他元素(如订阅按钮)形成对比。 它们的语气必须真正从页面的其余部分中脱颖而出。
在 Hubspot 的一项测试中,它发现红色按钮比绿色按钮更好。 再说一遍,在考虑红色按钮之前,请确保红色不是页面上的主色。 否则,它不会产生更多的对比度。
如前所述,您可以使用色轮选择一种互补色,这是一种与您的主色完全相反的颜色。
但是,在选择正确的颜色组合之前,您必须了解人们对颜色的看法不同。 颜色总是取决于它们如何匹配您的品牌。 这就是为什么您需要选择与您的品牌个性相匹配的颜色,因为它会影响访问者的购买决定。
例如,如果您的品牌粗犷或阳刚,则不得选择粉红色的号召性用语按钮。 相反,选择一个橙色的大按钮。
颜色如何影响转换将取决于上下文。 例如,由于蓝色是网页设计中超链接的常用颜色,因此人们总是将它们与超链接相关联。 因此,他们知道如果文本是蓝色的,他们可以点击它。
CTA 按钮也是如此。 你不需要选择蓝色。 但是,请记住,您为按钮选择的任何颜色都将与操作相关联。 为您网站上的所有 CTA 始终使用该颜色。 但避免对不可点击的项目使用相同的颜色。 此外,不要在同一页面上使用不同的 CTA 颜色。
8. 保持简单
网页设计中的“显而易见总是赢”。 这就是扁平化、极简主义设计提高转化率的原因。 这样做的原因是它专注于最重要的元素。 简洁的设计出现在其他戏剧性的视觉效果之上。 通过专注于基本元素并摆脱那些装饰,这种方法有助于创建一个可以肯定优化转换率的有组织的布局。
此外,简约的设计允许在您的网站上为相关 CTA 留出更多空间,从而防止页面包含非必要元素。
即使简约的设计很棒,你也不应该过度使用,因为人们会失去兴趣。 例如,在 CTA 按钮中,人们习惯于看到具有深度或尺寸的按钮。 这些特征是交互的指标。
但是,如果您有一个平面按钮,则访问者在浏览您的页面时很容易忽略它。 因此,请确保使用对比鲜明的按钮颜色。 并选择一个使按钮可见的位置。
因此,每次创建页面时,您都必须问自己是否有办法获得更简单的版本。 通过保持简单,您可以期待更好的转换和更美观的设计。
一个简单的设计迎合了一次可以处理较少信息的人。 如果您的访问者在一页上看到很多东西,他们会不知所措并离开。 当您在您的网站上为用户提供出色的体验时,请确保摆脱那些不重要的元素。
9.遵循格式塔相似性原则
这是解决相似性法则的设计原则。 在这里,法律规定人脑喜欢将相同的对象组合在一起。 这种机制使人类能够理解事物并帮助他们组织嘈杂的环境。
当您遵循这一原则时,您需要对可以相互关联的相似项目或元素进行分组。 这些将包括转换按钮、图像和推荐框。
例如,您可以对您的选择加入表格进行惊人的推荐,以提高转化率。 虽然推荐书不是为铅磁铁设计的,但参观者可以将它们联系起来,因为它们仍然在附近。
10. 添加面孔
当人类看到另一个人的脸时,他们会被触发去同情那个人。 这就是为什么当你传达一个问题时,你的访问者可能会理解或感觉到与它的联系。 出于这个原因,专家建议在文章、选择加入页面和案例研究等中加入人脸。
如果您有品牌的代言人,或者您是品牌的代言人,则需要完成照片拍摄。 要求摄影师在一侧拍摄大量负空间的水平照片,您可以在其中放置 CTA 或文本。
对于房地产网站,房地产照片的秘诀之一是添加人脸,而不仅仅是房屋或财产的一部分的图像。 您可以聘请模特或只使用库存照片。 但是,请确保您选择的面孔准确地代表您的品牌。 通过使用反映您的目标人群的面孔,它可以帮助显着提高您网站的转化率。