158-5022-6710
185-5051-7711

吴江网站建设_手把手帮你学会在网页设计中运用负空间

1613
发表时间:2018-08-22 08:38

吴江网站建设_手把手帮你学会在网页设计中运用负空间

留白,另一说为“负空间”,这两个词常常互换使用。它们共同所指的都是屏幕中出现的元素之间的一种关系。所谓留白不一定是要白色,或黑色。就算是图案、色彩或纹理背景都可以被称为留白。负空间是在内容外创造一个空白的环境,好让观者将注意力更加集中于内容。

吴江网站建设_手把手帮你学会在网页设计中运用负空间


这篇文章中,我们将讨论,怎样运用设计师的锦囊妙招中的超强致胜工具:留白。



留白的原因


就像已经被大家所讨论过的,负空间一开始是作为审美而不可或缺的一部分。


在网页设计中,在哪里留白显得更加重要。可以这么说,它决不仅仅处于视觉审美的需要,它得肩负更重要的角色,即在视觉审美与引导用户之间达成完美平衡。而且,如果现在有一段文字,留白还需在此基础上让文字清晰,创造具有可读性的环境。



总的来说,留白直接的影响如下。


1、眼球扫描


在网页中,两块较大内容元素之间的空间(在此称大空间),这类留白能吸引并引导用户的眼球扫描页面的方式。当运用得当,就能引导用户的视线去注意那些你想突显的元素。这在品牌标识展示或增加用户交互行为的时候最为有效。


2、清晰度


在两个较小的内容元素之间的空间(在此称小空间)诸如一个文字,或一行文字,列表,图标等,恰当的留白也能让这些元素更加易于辨认。


3、视觉审美


当你看到一张大图片,留白在视觉审美中发挥了很大的作用。举例来说,如果内容乱七八糟绝不会是一张好看的图片。


4、高品位


丰富的留白将为你的页面灌注一种精致优雅的氛围。


为了更好的理解和运用它,我们将要梳理不同类型的留白(大空间和小空间),以及运用它们的不同的方法(被动和主动)。


大空间和小空间


网页设计中,在哪里运用以及怎样运用负空间将取决于它们的角色。简言之,我们把这些角色大致分为大元素和小元素。


1、大元素的留白


大元素的留白是涉及到两个大型元素之间的留白。主要运用于:


总体内容


独立的不同元素


文本分列


Margin


Padding


图片之间的距离


这类型的留白空间很大程度影响用户的视觉流,不管是潜在引导或者强势推动都可以让注意力引导到你想要他们停留的地方。但在此要强调的一个法则即是距离越大动力越强。想要打破平衡,然而,由于太多的留白违反了格式塔原则,其结果就是消弱了对象间的关系。


2、小元素的留白


另一方面来说,当设计师们谈到小元素留白,他们通常是指的较小的元素或是较大元素中的次级元素的留白。他们包括:


字体


行距


段落


列表


按钮


图标


小元素的留白最多被用在强调网站整体的清晰度上面,尤其是在排版的清晰度上。当你试图利用文字间的留白打破平衡,保持清晰易读的同时又能不至于太过而让它偏离了重要的内容。我在这里,仅仅是一个提议,建议将英文行距设置为1.5px最为完美。(译者按:这里的作者没有考虑中文字体的行距)


就像格式塔规律中谈到的,让距离较近的元素视觉上更为接近,这将暗示它们具有相同的功能。小元素的留白将会让用户知道按钮与链接之间的关系,而同样的留白将强化这种机制,这在用户使用过程中进一步增强认知度。


尽管留白被分为了大元素和小元素两种类型,每一种类型也有主动与被动两种用法。


被动留白与主动留白


留白的应用其实都是取决于内容。


就像此前谈到的,留白越多,内容的吸引力就越强。但是,你不会想要页面的每个元素都具有最大吸引力,更别提有限的屏幕空间了。


那就让我们看看被动和主动的留白是如何帮助负空间达到视觉平衡的。


1、被动空间


我们把被动的留白视为空的最小化。


没有足够的留白,一个网站将会变得无法阅读而失去方向,所有的精力都被用于对抗视觉的混乱。被动的留白就是用空白区域去试着让网站易于理解。


2、主动空间


在上面的这个网页中页面里有好几个元素:菜单栏按钮、下拉箭头、下拉提示等,然而,屏幕中占据主导地位的是中间的黑色文字,这让其他的元素都放在了周围,设计师放大了中间的留白区域,然后把最重要的信息放在这里,让用户的注意力完全集中于此。


同时,减少两行元素间的距离,这一过程也许可称得上是一种“隐藏”的方式。就像你常常在网站上见到的法律申明和版权信息一样。


极简主义


留白越多,也可以说你的页面就越趋向极简风格,你通过删减很多元素来避免凌乱。


极简风格是一种设计的哲学,可以说它不好但也不坏。它祛除了所有能带给用户视觉干扰的杂碎,而让用户关注到你所展示的重要内容。没有了噪音,剩下的精华内容就呈现在一片优雅的留白中。


极简风格在两个方面影响你的网站:现存的元素数量,高品位的氛围。


1、元素数量


你的页面存在的元素越少,那么页面剩下的元素就显得越重要。


如果页面只有一个元素,即使它蜷缩在角落里,仍然是你的用户关注的焦点。如果你的页面有成千上万的小元素,你的用户也许会随机地寻找他们的兴趣点,或者由于选择太多而放弃。


这样一种相关性,让我们深知,在你的设计中要增加留白,最简单的方式就是减少页面元素数量。但我们知道说起来容易做起来难。极简主义可以说适用于任何网站,你绝不会想要把用户不需要的也填充到网页上。然而,作为视觉审美来说,极简风未必适合所有的网站,尤其是对于内容丰富的网站来说,就不会愿意这样光秃秃的一览无余的画面。


当提到极简主义,请大家记得,我们不是仅仅在谈论审美方面,它也不是我们的目标。恰如其分达到极简风格的水平是去精简页面元素,直到不能使用。这需要在用户中进行大量测试,然后在你减少的最多时停止。


2、高品位的氛围


极简风现在变成了高品位的同义词,它能魔法般地营造出一种精细、时尚和优雅的氛围。时尚行业的网站在数字设计方面都是倾向极简的,但是对于一些零售行业的企业来说,还很少看到有类似的设计。


高品位的氛围是与留白有着直接的联系的:


重度留白:可以见到一些奢华、高端的品牌中使用。


中度留白:比较平衡但仍是有品质的。


低度留白:可见于一些廉价的、质低的、凌乱的展示效果中


总结


作为一种视觉艺术,设计不能忽略最重要的视觉艺术基本原则。它需要满足审美的同时也要创造出更为长远的实际价值,比如更多的互动,更人性化的交互。


对于入门的设计师来说,做网页设计只是增加一个页面的可操作元素。但是对于高级设计师,做网页设计是如何巧妙的使用留白去引导用户进行交互。


吴江网站建设就选,苏州网联盛科技有限公司,http://www.szwlskj.com/


关键词:吴江网站建设 吴江网站优化


咨询热线:
158-5022-6710
185-5051-7711
在线客服
 
 
——————
热线电话
185-5051-7711
158-5022-6710

website qrcode
免费电话咨询
 
 
 
 
请输入您的手机号
*
验证码
 换一张
*
免费通话