网页中的平衡、对比、连贯和留白

作者:edream 来源:沉寂博客 时间:2008-11-24 12:11:00 

网页制作中需要把握好很多原则和细节,今天我们来谈谈网页设计中的平衡、对比、连贯和留白。

一、平衡

如果你的页面是平衡的,当用户浏览这个页面的时候就会感觉它们是一个整体,看得时候目光的跳转也会很自然。同时,构成页面的元素仍然是彼此独立(注意不是孤立)的,你不需要用线用颜色将它们直接地串接起来,这是为什么呢?因为它们彼此之间是平衡的。这就好比跷跷板,即便你看不到连接两端的人的木板,你也能感觉到他们是一个整体,因为“平衡”!

1、对称平衡

对称是最常见、最自然的平衡手段,这种方式通常用来设计比较正式的页面,不过也还需要和下面介绍的多种方式结合起来使用。

2、非对称平衡

非对称其实并不是真正的“不对称”,而是一种层次更高的“对称”,如果把握不好页面就会显得乱,因此使用起来要慎重,更不可用的过滥。

3、辐射平衡

页面中的元素以某一个点为中心展开就可以构成辐射平衡。

4、实战平衡

二、对比

如果说平衡搭起了一个稳定的页面框架,那么对比就是这个框架中的动态点缀。这里说动态并不是说要真的让元素动起来,而是要有“变化”。可以变化的因素包括:大小、颜色、字体、重心、形状、纹理等等。

三、连贯

前面谈到了对比,对比离不开变化,然而如果对比太多,变化也会太多,页面就会显得零乱,因此我们现在来谈“连贯”。在一个成功的页面设计中,有很多要素是必须保持一致的,这些要素通常包括:

1、布局

页面的上下、左右,页面与页面中间要保持布局一致。比如如果页面上方的表格居中对齐而页面下方的表格却左对齐,那么整个页面就会很难看。

2、字体

字体的大小、颜色应当基本保持一致。

3、导航栏

导航栏应当保持完全一样,通常应单单独为导航栏建立一个框架页,这样就可以保证更新导航栏的时候,所有网页都会被自动更新。

四、留白

国画中“画鱼不画水”的妙处就是留白的妙处。留白可以让访问者有更大的想象空间,就好像就如一个没有过多摆设的房间一样。上上下下、里里外外都塞得满满当当就是很糟糕的设计。

留白的原则包括:

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

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

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

标签:对比,设计,字体,导航
0
投稿

猜你喜欢

  • sql server 锁表语句分享

    2012-02-12 15:49:20
  • 浅谈视觉设计的准确性

    2007-09-18 17:59:00
  • MYSQL和ORACLE的一些操作区别

    2008-12-18 14:33:00
  • JavaScript 组件之旅(三):用 Ant 构建组件

    2009-10-09 16:56:00
  • 如何用OleDbDataAdapter来对数据库进行操作?

    2010-06-12 12:56:00
  • 什么是Semantics?

    2008-04-16 13:45:00
  • asp如何对欲删除的记录确认后再删除?

    2009-11-20 18:48:00
  • IE8的一些CSS hack

    2008-03-17 13:08:00
  • asp禁止站外盗链、判断星期几方法

    2007-10-02 12:58:00
  • 将各种类型或对象都转变为数组

    2009-12-28 13:19:00
  • 关于reflow

    2007-09-23 13:30:00
  • 自然选择:自然界的颜色与界面设计[译]

    2009-09-19 17:17:00
  • 正在研究XMLHTTP如何正确传送大于7F(127)的二进制数据

    2008-09-13 18:41:00
  • asp中数组的用法

    2008-05-12 22:29:00
  • js检测浏览器语种,适合于多语言版本的站点

    2007-09-12 19:16:00
  • 数据库技巧——MySQL十大优化技巧

    2011-01-31 16:44:00
  • ACCESS入门教程:用向导建立数据库

    2008-01-17 12:46:00
  • WEB2.0网页制作标准教程(10)自适应高度

    2008-02-19 19:21:00
  • 2003年至今网页尺寸增长3倍

    2008-04-29 19:27:00
  • 一个sql查询器,自动画表格填字段

    2011-04-10 10:58:00
  • asp之家 网络编程 m.aspxhome.com