搜狐首页-新闻-体育-娱乐-财经-IT-汽车-房产-家居-女人-TV-ChinaRen-邮件-博客-BBS-搜狗 

数码天下 > 网狐学园-全中国人的电脑学习中心 > 网络应用-网狐学园 > 网页制作
把握好网页设计中的平衡、对比、连贯和留白
时间:2006年02月27日10:27 我来说两句(0)  

 
来源:天极网

25亿像素的大照片
P2P视频下载60%为情色
两大浏览器龙虎争霸
最佳创意产品NuLOOQ
迅雷存在严重DDOS漏洞
Windows的环保卫士
Vista和XP响应速度相近 用注册表砌安全墙
插件让IE向Maxthon看齐 把摄像头变3D扫描器
搜狐数字艺术博客大赛 低端显卡Aero亦流畅
搜狗拼音输入法 | 暴风影音 | WinRAR | FlashGet | 瑞星卡卡 | Firefox | Picasa
搜狗工具条 | ACDSee | Maxthon | Internet Explorer | Windows Live Messenger

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

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

  一、平衡

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

  1、对称平衡

  对称是最常见、最自然的平衡手段,这种方式通常用来设计比较正式的页面,不过也还需要和下面介绍的多种方式结合起来使用。
比如图 1所示的网站,如果你在页面正中间划一条垂直向下的直线,你会发现页面的两边的布局是基本对称。

  2、非对称平衡

  非对称其实并不是真正的“不对称”,而是一种层次更高的“对称”,如果把握不好页面就会显得乱,因此使用起来要慎重,更不可用的过滥。比如这个网站https://www.graphic.com.cn(图 2)就打破了常见的对称。但是如果仔细看的话还是能够感到某种“对称”的影子。

  3、辐射平衡

  页面中的元素以某一个点为中心展开就可以构成辐射平衡。比如图3就是典型的例子,页面的正中是一个大大的LOGO,外侧环绕着多个链接 。

  4、实战平衡

  下面我们通过一个LOGO设计实例来看一看平衡的多种变化。

  二、对比

  如果说平衡搭起了一个稳定的页面框架,那么对比就是这个框架中的动态点缀。这里说动态并不是说要真的让元素动起来,而是要有“变化”。可以变化的因素包括:大小、颜色、字体、重心、形状、纹理等等。 我们还是通过简单的例子来介绍一下对比的应用,图 9是我们设计的底版,字体一样、大小一样、颜色一样,单调枯燥。

  三、连贯

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

  1、布局

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

  2、字体

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

  3、导航栏

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

  四、留白

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

  留白的原则包括:

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

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

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


热门新闻排行
01 广州Vista盗版江湖调查 全部破解版本大曝光
02 Windows Vista不兼容的应用程序,还有谁?
03 中国海贼版Vista入侵日本 "番茄花园"打头阵
04 挑战视觉享受极限 五款流行多媒体播放器比拼
05 Vista SP1发布计划已定 Windows XP SP3不再来
热门教程排行
01 安装系统不求人 就算没有光驱和软驱也能行
02 让电脑运转如飞 Windows Vista九则加速技巧
03 逐一辩驳:破解Windows Vista的四个性能谣言
04 专家经验谈:Excel工作表的几点设计策略
05 整容大法!Photoshop简单教程之美女去斑篇
蜘蛛侠主题Mod美图赏

蜘蛛侠主题Mod美图赏
两款可爱的iPod音箱

两款可爱的iPod音箱
小心别丢了 全球最袖珍5款科技玩意

全球最袖珍5款科技玩意
最强的概念车设计:超级巴士

概念车设计:超级巴士
LLADRó瓷器诠释人性情感

LLADRó瓷器诠释人性
德国家具设计精选作品

德国家具设计精选
最具创意的多功能床(图)

最具创意的多功能床
2006离生活最近的创意

2006离生活最近的创意
欢迎访问:软件频道 下载频道 网狐学院 数字艺术 考试 病毒与安全 创意赏析

(责任编辑:luwei)



共找到 个相关新闻.

我来说两句 全部跟贴(0条) 精华区(0条) 辩论区(0条)

用户:  匿名发表:  隐藏地址:


设为辩论话题      


精彩图片新闻


激情四溢沙滩宝贝


数码公社专栏

相关链接





搜狐短信 小灵通 性感丽人 言语传情
三星图铃专区
[周杰伦] 千里之外
[誓 言] 求佛
[王力宏] 大城小爱
[王心凌] 花的嫁纱
精品专题推荐
短信企业通秀百变功能
浪漫情怀一起漫步音乐
同城约会今夜告别寂寞
敢来挑战你的球技吗?
 精彩生活 

星座运势 每日财运
花边新闻 魔鬼辞典
情感测试 生活笑话


今日运程如何?财运、事业运、桃花运,给你详细道来!!!





菊花台
迷迭香
青青河边草
丁香花
原来你也在这里
爱如空气
不要再来伤害我

公社热图


·北美惊现若干神秘UFO/图
·范冰冰真空写真露点[图]
·传说中国内第一美女车模


频道精彩推荐

·禽流感疫情 伊朗核问题
·中国工程师巴基斯坦遇害
·都灵冬奥会 德国世界杯
·奥斯卡金像奖 购车指南
·激光照排之父王选病逝
·一个馒头引发的血案
·第48届格莱美颁奖典礼
·NBA F1 国足
·两会:三农、新农村建设
·人民币升值压力增大






不怕不怕
吉祥三宝
桃花朵朵开
千里之外
大城小爱
梁祝
迷糊娃娃可爱粉红卡通
四季美眉给你最想要的

news
搜狐分类 ·搜狐招商


创意就是这么简单
女星豪乳尺码大曝光
·现场抓拍明星着透视装
·芙蓉二代横空出世
·央视女主持辞职拍艳照
·徐若瑄15岁全裸写真曝光
·拍摄:娱乐圈性交易过程
·抓拍模特海滩宽衣解带
·外国女生流行拍的艺术照
·台湾十大波霸照片大比拼
·网络美女全裸人体摄影
·范冰冰终于还是脱了

推荐企业
2006年世界电信展 诺基亚 瑞星 联想 摩托罗拉 三星 清华紫光 金山 索尼爱立信 索尼
给编辑写信



设置首页 - 搜狗输入法 - 支付中心 - 搜狐招聘 - 广告服务 - 客服中心 - 联系方式 - 保护隐私权 - About SOHU - 公司介绍 - 全部新闻 - 全部博文
Copyright © 2018 Sohu.com Inc. All Rights Reserved. 搜狐公司 版权所有
搜狐不良信息举报邮箱:jubao@contact.sohu.com