当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > 设计理论:网页版面布局的平衡性原理

心得技巧
网页设计师学习网页设计的经验和技巧小结
10个优秀的 Web UI库/框架
40个CSS/JS风格和功能技术处理
最佳网页宽度及其兼容实现方法
让你了解HTML及资源是如何加载的
flex程序Firefox下中文输入乱码的bug
网页制作常用英文字体
在iframe框架中打开页面的方法
企业网站与栏目字典 中英文对照 做中英双语企业网站的朋友需要
前端开发大众手册(包括工具、网址、经验等)
iframe在IE6下出现横向滚动条的解决方案
IE6中奇数宽高的BUG
IE6中PNG Alpha透明(全集)
交互设计理论:良好的交互设计的三要素
互联网产品设计:启发式评估
B2C网站用户体验设计:Checkout(结帐流程)设计
40个2010年网页设计趋势单页布局实例
讨论基于B/S架构开发项目的原型工具
用户体验设计:UED设计流程和方法
网页设计参考:23个出色的蓝色系网站设计

心得技巧 中的 设计理论:网页版面布局的平衡性原理


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-01   浏览: 87 ::
收藏到网摘: n/a

几年前网页设计还被平面设计视为不入流的设计,不过随着网络使用的普及,网页设计的整体发展有了很大的提高,越来越多的设计师专做了网页设计师!

网页版面与报纸版面设计

网站设计就象传统的报刊杂志一样,我们通常都是把网页看作一张报纸,或者一本杂志来进行排版布局。但是印刷和网络是不一样的。

传统的布局排版并不适于网络,因为传统的印刷布局,几乎想要什么样的平面效果都能很好的达到,但在网络上设计就很困难,尽管很多的效果都能通过一些Javascript或是高级的CSS技巧来实现,但结果是使用你的源代码很臃肿,网页载入很慢。

而同样的,网络上的很多排版布局也不同传统的印刷打印,毕竞这是两个相隔时间很长的事物。但是,在最近的几年中,我们发现越来越多的报纸开始使用网页设计布局排版,比如大量的页面留白和基于网络的设计。同时,我们也可以借鉴传统报纸的排版布局来获取新鲜的网页创意设计灵感。

el economista (madrid, spain)
经济学家报 马德里,西班牙

el economista 使用一个很传统,含蓄,独特的报纸版面和公告,在印刷上面突出比较重要的文章。 图片信息支持的内容和标题,四周都是大量的空白,我们可以看到这个版面设计很有网页的风格。

下面我们通过几个简单的例子,从四个方面来看版面布局的平衡性,分别是留白、颜色、文字和节奏

留白

这是某房产广告设计,可以看到很好的运用了留白

颜色

色彩的平衡性

文字

文字排版的平衡

节奏

节奏表现手段从支配行为上可以概括为速度(快、慢),力量(轻、重),从排版上可归纳为集中与分散。节奏表现手段的运用所唤起的直接效果可以大致概括 为紧张、松弛、宁静、躁动。

如果在绘画实践中对一根线条或是一笔颜色在速度上的使用造成快慢差异,其画面结果可以直接导致视觉及心理上的紧张与松弛感。同 理,在网站设计中,针对点、线、面等元素,以集中或分散的排列差异变化将导致视觉及心理上的宁静与躁动。

好啦,本期分享内容就到这里,下面提供袁大师的精彩ppt给大家下载

 /upload/tech/20091001/20091001095039_9f53d83ec0691550f7d2507d57f4f5a2.rar