SEARCH
新闻资讯

网站知识库

成都网页设计中留白的意义,如何在网站设计中利用

2019/11/1 22:42:29

留白的意义是为了实现产品的目标,而大空间和小空间的区别也让留白更加过细,过细的效果也变成高品质的极简主义。因为屏幕是有限的,因此网页设计也是有限的。可以这么说,在屏幕这个小小的盒子中,每个像素都是一块不动产。就算是菜鸟,也懂得一个页面不能加载过多的内容,但涉及到究竟应该规划多少留白,包括经验老道的设计师或许也很茫然。今天成都网站设计-唯赛互联就分享下关于网页留白的内容。  

留白的意义  

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

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

留白的缘故原由  

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

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

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

成都网页设计中留白的意义,如何在网站设计中利用

1、眼球扫描  

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

2、清晰度  

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

3、视觉审美  

当你看到一张大图片,留白在视觉审美中发挥了很大的作用。举例来说,假如内容杂乱无章绝不会是一张悦目的图片。  

4、高品位  

雄厚的留白将为你的页面灌注一种细腻优雅嵬峨上的氛围。  

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

大空间和小空间  

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

1、大元素的留白  

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

总体内容  

自力的不同元素  

文天职列  

Margin  

Padding  

图片之间的距离  

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

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

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

大多数用户首先都会注重到页面题目,也就是“Digitalart&Experiments”这句话,而在它外围的则是大面积的留白,这样就使得用户的注重力完全集中于此。  

尽管页面的顶部和底部只有一侧留白,但它们也同样可以引起注重。总而言之,在此,留白的区域很好发挥了吸引注重力的作用,而设计也就好像看上去不可思议的简洁起来。  

设计师现实上是采用留白区域作为一个空白幕布,以便给观众留下惊喜,好让我们可以看到他的作品的雄厚细节。一旦鼠标移动到底部导航的任一栏目时,幕布上就会出现作品的图片作为背景全屏展示。这种结果创造出类似年幼时的一种探索和发现的乐趣:偶然间闯入一片空白的场所,发现了每个抽屉都藏匿着雄厚多彩的视觉盛宴。  

你可以试试鼠标滑过时屏幕上发生的戏剧性结果。  

通过留白区域作为工具来诱导用户注重到他的作品,设计师创造出了一种奇怪奇特的体验。在个作品出现后,我们就很想看看他还有哪些佳作。这感觉蛮吸引的,由于你将会克制不住地想要找到为紧张的内容。但这都要建立在一个完善的点燃你好奇的切入点基础上。


如没特殊注明,文章均为成都网站建设公司唯赛网络原创,转载请注明来自http://www.weseo.cn/News/knowledge_675_10443.html

Contact

ADD:成都市青羊区光华东三路西环广场6楼

TEL:028-64232097

Wechat

微信二维码