永远不要低估网页设计中空白的重要性

空白,也称为负空间,表示不同设计元素之间的区域。从行距和字间距到文本和图像周围的空间,再到平面设计中的页边距和装订线,不一而足。乍一看,空白是一种非常简单的设计技术,以至于许多人会低估它的作用。其实空白的作用如此强大,它本身就可以通过吸引用户对某些重点的关注来提高您网站的转化率。

就像我们的办公桌一样,随着时间的流逝,网页设计的发展已可见一斑

网页设计中的留白,为网页上的图形元素提供了“呼吸空间”,元素也因此拥有了自己的视觉焦点。它不一定是白色或空白,它可以是任何颜色、图案或者背景图像,甚至是背景视频,只要它能将用户的注意力吸引到您喜欢的号召性用语(CTA)上即可。

研究证实:空格可以帮助您提高转化率

一些客户认为空白是不必要的,因此倾向于用其他信息填充空白。结果,太多的信息可能会导致认知超负荷。威奇托州立大学进行的一项研究证实,增加空白可以提高可读性并专注于CTA ,这两个方面都与更高的转化率直接相关。

您的用户更喜欢这两种类型的空白

微空白是文本行、段落和字母间距之间的空间,而长段空白是合成中主要元素之间的距离,它还指填充和边距。 两种类型相辅相成,并且同等重要。

通过增加行和段落之间的间距在设计中添加微空白,可提高可读性,易读性和理解力,另一方面,长段空白可以帮助用户的眼睛轻松地扫描设计,也使您的页面看起来更加精致和美观。

有研究发现,在段落之间以及左右两侧的空白处充分利用空白可以将理解力提高近20%。读者不仅能更好地理解页边距,而且有80%的读者更喜欢更多有空白的设计而不是更少,——如您所见,微空白和合理的大片空白不仅可以改善设计,而且用户也很喜欢。

苹果,三星和华为着陆页上的空白测试

让我们看看智能手机行业中最具影响力的品牌,苹果、三星和华为如何使用空白在其着陆页中传达主要信息。就吸引他们的主要信息而言,苹果绝对是赢家。登陆页面传达了一个清晰的信息,吸引了81%的关注,比三星高2倍,比华为高4倍。

这种巨大的差异是由于Apple似乎确实在充分利用空白-宽边距,行与行之间的间距。最重要的是,主标题和副标题周围没有其他对象或消息会分散用户的注意力。即使是iPhone的图像,其位置也是如此精致,以至于几乎不引起注意,只会产生极简主义的感觉。很经典,不是吗?

三星还以背景图像的形式使用了大量空白,而不是在苹果登录页面中使用空白。结果,由于缺乏对比和视觉层次,对主要信息的关注度仅为38%。

如您所见,由于人物形象的影响,有10%的注意力流失了。此外,面部正朝着用户看。对于人物图像,请尝试使眼睛朝您希望用户看的方向看,例如标题,确实有所影响。 注意力的另一个重要部分是与COVID-19相关的信息。由于在健康危机期间在线销售一直在蓬勃发展,因此此信息是必要的并且可以证明是合理的。

如前所述,华为的主要信息吸引的注意力比苹果少4倍。

可以清楚地看到,与其他页面相比,目标页面的空白空间更少,尤其是在主消息下方。即使将对摄像机的关注(占14%)添加到设计者的目标中,两者之间的差异仍然非常显着。 这样做的主要原因是登录页面中包含过多的对象、部分和消息,将用户的注意力平均分散到所有部分可能是一个目标。但是,很明显,这次登陆并没有立即引起注意的CTA。相反,用户的关注点正在从一个项目转移到另一个项目,而没有特定的最终目标。

结论


尽管对于某些人来说,空白似乎是空的和不必要的,但是空白确实是一个非常有价值且功能强大的工具。 您可以使用微空白来提高理解力,并可以使用大片空白来强调CTA并提高转化率。优先考虑空白与内容之间的平衡,以便您可以将用户的注意力吸引到号召性用语(CTA)上并增加转化次数。

注:本文翻译引用自国外