适当地停顿在一次演讲中给听者一个击败完全掌握前面一点的。空格可以增强或改变的元素它触动,甚至自己都讲述一个故事。

但为了充分利用空格在网页设计中,我们必须首先了解它的多种形式和功能。就让我们一探究竟吧。

空格是什么?

空白,有时被称为“负空间”,是故意留下空的空间。对于网页设计师来说,空白边缘或填充页面上的元素之间。对摄影师来说,负空间是由像素周围的对象在一个图像。虽然空白空间是空的,它不是没有意义的。

负空间创造喘息空间的重要元素,关注和提高它包含的条目。只是觉得停顿可以有意义的对话。一个犹豫在回答这个问题之前,“你喜欢吗?“可以背叛,即使是一个有力的“是的”是一个谎言。负空间可以改变音调和节奏的乐曲,影响室内设计的美学和便利,等等。

空白的例子

空格或负空间,可以找到几乎任何地方。它可以深,天鹅绒般的背景对比星星在夜空。它可以航海船周围的混乱的靛蓝,或者一个空白页护照指引你计划你的下一个冒险。

被称为“马”(間)在日本,负空间是一个重要的元素的盆景树,树枝间的空隙,叶子,树的设计和土壤影响曲率的树干和树叶的青春。

空白印刷中发挥了关键作用,因为周围的边缘文本和字母之间的空间,话说,段落,图像,和线直接影响书籍的可读性和流动,杂志或其他印刷媒体。的进化的空白在印刷材料甚至影响我们阅读的方式。满满的古代手稿让位给印刷材料有更多喘息的空间,需要大声朗读消散。

今天,杂志、书籍和网上出版物大量利用空白使文本更skimmable。建筑师利用空间在创建开放的地板计划,和简约的室内设计通常功能丰富的空间。

但是仅仅因为它叫做“空格”实际上并不意味着它需要白色。视觉空白可以是任何颜色,甚至黑色,见下图。这张照片的“空白”是黑暗,纹理空间围绕着主题——白色的花。

空格也可以我们听到(或者没有听到)。通常称为“负空间”在音乐的世界里,沉默可以一样有效的一个吸引人的合唱或强大的高潮。也许最极端的例子是约翰·凯奇是4 ' 33”,它由4分33秒的沉默。

但我们可以看到更为温和的停顿在许多类型的音乐。“洛葛仙妮”被警察有很多帮助建立张力的停顿。布兰妮的流行音乐重创“强”功能停止后的歌词,“嘘,停下来,”,强化了自己的歌词。和韩德尔的《哈利路亚大合唱”“弥赛亚”特性一个戏剧性的结束停止向之前最后的“哈利路亚”。

飞船的主人喜欢马丁·斯科塞斯,弗吉尼亚·伍尔夫,班克斯利用空白灵活的精度在他们的作品。空格是在我们周围创造平衡和增强它周围的元素。

空格在网页设计的重要性

空格是不可分割的一部分,网络和用户体验设计。它还可以帮助标识脱颖而出,加强品牌设计,提高网上购物的经历。

没有适当的空格,网页会感到凌乱,糟糕的用户体验,并发送你的跳出率飞涨。研究表明,周围的空白文本直接影响受众的阅读速度、理解和整体的体验。和相对小的变化空白的页面上(差异只有10%)可以引起显著的反应也是不同的。

5的方法在设计中使用空格

没有一个完美的空白在网站设计公式或一个神奇的百分比,每个设计都应该坚持。一些研究表明,不到50%页面应该包含空格,以免产生负面影响可用性。另外一些人暗示,这是更好的超过50%填满空白的页面。

另一项研究发现空白偏好随年龄和教育水平。所以,如果你想知道多少空白是理想的一个网站,我强烈推荐一些a / B测试。尝试几个不同的选项,看看哪一个收益率从独特的受众更好的响应。

话虽这么说,这里有几种方式可以利用空白加强网站设计。

1。增加点击通过率(CTR)

想增加你的CTR吗?看看你周围的空白文字-动作(CTA)按钮。感觉凌乱吗?会使用更多的喘息空间吗?一个启动能够增加铅一代更是达到惊人的232%部分重新设计他们的CTA报头时将更多的空白。

空格可以帮助游客关注的部分你的网站你最希望他们相互作用——比如你的免费试用或CTA按钮。

2。改善可读性

几个因素影响网页的易读性,包括字体,字体大小,颜色对比文本和背景和空白。一项研究发现,增加利润率在文本阅读速度放缓,但改进的理解。相同的研究还表明,提供足够的呼吸空间在段落(个人之间的字母、单词和行)可以从读者引起更有利的反应。

3所示。优化视觉层次结构

好的网页设计利用视觉层级方便游客浏览页面。设计师可以利用空白鼓励z字形扫描和方便游客消化在一个页面上的信息。

4所示。创建一个优雅的感觉

标志性的时装设计师可可·香奈儿曾经说过,“简单的主题是所有真正的优雅。”So, it makes sense that simple web designs with lots of white space create a feeling of sophistication. Designers of luxury products from clothing to cars have been leveraging whitespace for decades and today we can see ample whitespace in high-end websites for brands including Chanel and Ferrari.

5。建立信誉

进行的研究斯坦福大学有说服力的技术实验室发现十方法web设计者可以提高一个网站的可信度与游客。其中包括建立一个看起来很职业的网站,使网站容易使用。正如我们之前所讨论的,空白可以帮助出一种豪华、典雅,从而增加网站的感知专业性。和创建一个容易可校验的空格是伟大的,用户友好的设计。

6。确保可访问性和包容性

万维网联盟(W3C)建议使用空格整理网站设计,组相关内容和项目,使页面更能扫描的。

一定要选择一个颜色为你的“空白”,为文本提供了充足的对比。你可以看到如果你的颜色比文本Web内容可访问性指南Webflow的设计师通过打开“字体”下的颜色选择器样式面板。

发现激励方法在设计中使用空格

寻找一个小的灵感为您的下一个web或平面设计吗?查看Webflow的博客创新的网站设计的集合。并确保与其他设计Webflow展示。