网站首页网站地图google地图百度地图学习库RSS在线PSPS联盟素材下载  PS视频教程专题 PS爱好者教程网www.psahz.com PS教程自学网QQ群

网页设计留白技巧教程:学会在网页设计中运用负空间(2)

时间:2015-05-25 09:33 来源:教程资料 作者:网页设计 阅读:

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

1、眼球扫描

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

2、清晰度

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

3、视觉审美

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

4、高品位

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

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

大空间和小空间

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

1、大元素的留白

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

总体内容

独立的不同元素

文本分列

Margin

Padding

图片之间的距离

译者注:这里的Margin和Padding指的是网页设计中元素标签外部范围的区域。参考下图可以帮助理解。

网页设计留白技巧教程:学会在网页设计中运用负空间

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

让我们看看下面这个网站,以此作为例子来说明留白是如何诱发用户交互行为。

Tomasz Wysocki’s

网页设计留白技巧教程:学会在网页设计中运用负空间

PS笔刷下载 PS滤镜下载 PS形状下载 PS样式下载 PS动作下载 PS图案下载
相关教程