摘 要：
关键词：
中图分类号：TP393 文献标识码：A 文章编号：
网站界面设计指的是对网站中的人机交互、操作逻辑、界面美观的整体设计；其中的视觉元素指的是图片、文字、色彩以及动态视频等可以被视觉观察的对象。
好的网站界面设计不仅是让软件变得美观、操作舒适，更重要的，是要把功能等信息快速、有效的传达给受众。因此，各种视觉元素作为这个舞台上的角色，对网站效果起到关键作用。
界面的组织不等于各个元素简单拼凑在一起。正如心理学家、美学家鲁道夫•阿恩海姆在其书中说到的，“凡是格式塔，虽说都是由各种要素成分组成，但不等于各成份之和。 ”研究视觉元素在网站界面设计中协同合作的方法，关键是要从整体角度审视和理解网站的结构，在理解的基础上让网页变得美观、操作舒适，突出信息传递的快速有效性。
1. 理解网站的结构
网站是由彼此独立又互相联系的网页组成的。如果把网站比作一本书，每张网页就如同书中的一页，两者在结构上存在一定相似性。但从信息提供的方式看，两者又是截然不同的，书和杂志的信息为“顺序排列”，网站则不然，它允许读者通过搜索主动获取信息，并可以通过输入和提交数据进行反馈，突出互动性，这种现象也使网络“网”的概念更加名副其实。
认识网络媒体的网状结构可以从两个角度入手：
1.1 平面的网——框架与构图分割
网页需要根据内容进行图文编排和区域分割，这些分割线有规律的排布、构成网格，就像一张平面的网隐藏于页面结构之中。分割、疏密、韵律、图底关系等适用于印刷媒体的视觉审美原则，在网络媒体中也同样适用。
1.2 纵深的网——网站树状结构
网站通过链接将页面和页面之间的信息相连，构成一个有层级关系的网。在这里，页面层级有高低，网站的首页如同大树的树干，导航菜单上的每一个子项就像分出去的枝干一样向下一级延伸。
结构规划直接影响到整个网站的运作效率，网站越大，信息量越多，结构就越复杂。因此，视觉信息如何组织成为研究的重点对象。既然信息交流是网站设计的根本目的，那么信息传达的有效性如何实现？笔者尝试从视知觉相关理论中汲取营养，寻找问题的答案。
2. 视知觉原理的运用
2.1 共同命运原则——控制页面风格统一
好的网站界面设计要做到视觉风格统一、各个页面间关系清晰，视知觉理论中的“共同命运原则”可以指导设计者更好的实现该目标。该原则指出，人们对于复杂信息具有一种认知习惯，即眼睛会自动把相似的图形划归为同一类。
色彩、图形、布局都是控制页面风格统一的重要元素，根据视知觉原理，各页面中的视觉元素相似可以表示关系相近，差异大则表示关系疏远，这种视觉暗示可以帮助浏览者更好的了解网站整体脉络。以网站The art of sustainable business（http://www.eco-ricoh.biz）为例 ,同类页面在导航栏等关键位置使用了同类色，浏览者在不查询网站地图的情况下，也能随时了解自己在网站中所处的位置。
2.2 主次关系——信息为先，避免喧宾夺主
视知觉原理中的“主次关系”理论表明，假设人类的视觉系统把视觉刺激分为图形元素或背景元素，那么前者是中心事物，后者就组成了统一的背景。在海报设计界，日本设计师福田繁雄利用这种将图底主次关系模糊化而形成的关系，赋予画面更大的空间感，形成独特的设计语言。
网站界面设计中，主次关系理论体现在图、文关系的处理上。网站不是一幅画，图形设计再精美也不能够忽略信息的传达，设计师需要让承载信息的文字具备可阅读性，同时创造有益于阅读的视觉条件。这就要求做到以下几点：
（1） 背景色与文字颜色拉开距离，背景图形简洁，避免文字“隐没”到背景中；
（2） 屏幕不方便旋转，非装饰性文字不要倾斜、倒置；
（3） 色彩搭配柔和、协调，使阅读时舒适、不刺眼。
以某运动品牌的网站为例，画面主体是华丽繁复的装饰性插图，但设计师将它们隐藏在深色背景中、只显示剪影，避免了喧宾夺主，而页面由此产生巧妙的区域分割，更将文字内容显得集中，信息传达清晰、有效。
2.3 格式塔知觉原则
“格式塔心理学”大约发轫于1921年的德国，主要研究如何将视觉信息组织成为有意义的整体。它在网站界面中的作用是帮助设计者实现图形、文字等视觉元素更好的交融。
(1)闭合原则：
该原则认为，人们的眼睛总是倾向于把一组个体要素感知成为一个可辨认的、整体性的图案。换言之，人们具有“追求形象完整性”的视觉欲望，给看到的图形加上本来没有的信息。比如当一根线条或者曲线不完整、不闭合的时候，人们会用眼睛使它完整化，成为自己心目中熟悉的样子。例如一些logo设计中没有勾勒出图形全部的线条和特征，而是刻意减少线条数量，让观看者参与图案的完成，加强了设计趣味性。
这一原则在网站界面设计中也可得到应用。荷兰一个介绍设计师及其作品的网站dutch designers（http:// dutchdesigners.com）的首页设计就成功利用了该原理——导航栏上的深灰色按钮像百叶窗般上下依次排列，按钮全部收起、紧密排列时拼合成一个大大的数字“2702”，按钮被点击时下级菜单会展开，将这个拼合的数字图案横向分割开。但即使被分 割，数字2702仍然可以被浏览者辨认，它代表的正是该网站下所有设计师的人数。相比直白的写出“我们规模庞大”、“已经拥有2702位”之类的标语，这种有趣且具有互动性的编排方式产生了更为醒目、有效的广告效应。
(2)对齐原则：
对齐原则指出，设计中的组成部分应该同一个或者多个其它组成部分呈直线排列。对齐可以使页面中的元素产生整齐、互相衔接的感觉，有利于传达设计美感。排列整齐的文字在视觉上产生区域分割线，又能成为视觉的导引。网站界面设计中，文字对齐可以产生隐形的外框，使得内容区块化、整体感强烈。
(3)黄金比例：
黄金比例指的是某一形式中各元素之间的比率，如高比宽的比率，近似于0.618。它在自然界、艺术和建筑中被广泛运用，如帕特农神庙、巴黎圣母院、鹦鹉螺的壳，以及现今苹果ipod MP3播放器的屏幕和按键所占比例等等。它作为一种技巧和规则，被传统设计领域重视并遵循已久，对设计的持久影响力显而易见。
(4)阅读重心与顺序模式：
显示媒体应该分为四个四分之一：左上角是主视区，右上角是强潜伏区，左下角是弱潜伏区。也就是说，阅读重心是从左上角引到右下角，右上角其次，左下角最弱。它
解释了为什么网站界面大多采用同一种布局模式：LOGO、导航条放置左上角，常用的搜索功能条放置右上角，最次要的信息则放在页面底部。
因此，当设计包含大量文本或大量同类型视觉元素时，可以利用阅读重心与顺序模式这一原理进行布局，使版面信息层次清晰、主次分明。
3. 总结
界面设计是一个多学科交叉的媒体，研究网站界面设计中视觉元素的构成方法，可以借鉴视觉心理学、视觉传达设计等多领域的研究成果。事实证明，这种借鉴可以为网络界面设计在信息传达、视觉美化方面添砖加瓦、锦上添花。
参考文献：
（美）Joshua Porter：《Five Principles to Design By http://bokardo.com/archives/five-principles-to-design-by/
