网页设计的艺术–留白

Willper 后花园 , , , February 10th, 2010 5 条评论

  在好的网页设计中我最留意的是那些对设计元素之间留白的聪明运用。留心不同内容区块之间的间距和排列方式,能让你的设计的整体感官大不一样,从而提升设计的品质。国画中“画鱼不画水”的妙处就是留白的妙处。留白可以让访问者有更大的想象空间,就好像就如一个没有过多摆设的房间一样。上上下下、里里外外都塞得满满当当就是很糟糕的设计。

  提升到理念的高度来看待留白,这其实一种视觉上的手段,留白也可以给人带来心理上的轻松与快乐,也可以给人带来紧张与节奏,通过这种手段可以向使用者表达出设计者的心理感觉。

  设计者在设计网页的同时也在同自己的使用对象在作一种交流,好的设计者能够达到同自己的使用对象进行心理对话的程度。不光通过页面上的文字、图片、动画的组合和排列,同时借助留白进行表达。可以达到非常好的效果,例如一个休闲的网站,设计者要传达给使用者的一个信息就是要是让他们轻松随意,无拘无束,光通过网页上的图片和文字的表达是干巴巴的,没有感情色彩的。如果能通过网页设计反映出这种感情色彩,显然这样的设计是较为高明的设计。能实现吗?当然可以,借助网页上的留白就可以,让留白更多的显示出自己的特色,在联系图片和文字的中间架起一道桥梁。

 

留白的原则包括:

1、元素之间的留白不能太大 这是基本的原则,留白过多,页面会变得零碎。

2、文本中间的间隔不能太大 文本应当紧凑,尤其汉字文本,如果字与字之间或者行与行之间空白太大页面就会非常难看。

总的来说平衡、对比、连贯和留白设计四条原则是在网页设计中必须始终牢记,但绝不是教条,应当结合自己的实际需要灵活的应用。

以下是我收藏的十几个将留白运用到淋漓尽致的网页设计:

Billings

 Billings 

Tom Watson

 TomWatson

Speak

Speak

Cultured Code

CulturedCode

Simon Foster Design

SimonFosterDesign

Culinaria

 Culinaria

Pizza Express

PizzaExpress

Paravel

Paravel

Larkef

Larkef

Matt Kursmark

MattKursmark

Delibar

Delibar

HiiDef

HiiDef1

Madewithpixels

Madewithpixels

Hundred10

Hundred10

Emptees

Emptees1

Reknit

Reknit

Hyperakt

Hyperakt1

Fusion Ads

FusionAds1<br />

声明: 本文采用 BY-NC-SA 协议进行授权. 转载请注明转自: 网页设计的艺术–留白
  1. February 11th, 2010 at 13:33 | #1

    額………….
    這個………..
    基本上…………..

  2. February 11th, 2010 at 13:47 | #2

    @landywon 粗糙理论呵呵

  3. February 11th, 2010 at 21:27 | #3

    还是第一次知道留白这个概念,学习了.

  4. February 19th, 2010 at 16:30 | #4

    @联盟者 在默认主题基础上修改的

  5. May 5th, 2010 at 09:15 | #5

    留白的应用能提高用户体验。

  1. No trackbacks yet.