网页设计视觉呈现分析

网页设计视觉呈现分析

随着商业社会的繁荣，大众生活品质的提高，互联网代表着一种崭新的信息交流方式，同时我们开始关注“信息的品质”。而网页是网络信息传达的主要载体，网页设计成为人机交互的重要对象之一。其视觉呈现更是直接影响最终的网络传播效果。通过对网页版式设计的视觉流程的筹划分析以及影响网页设计页面视觉呈现要素的阐述，凸显了简洁网页设计的视觉呈现和艺术美感的重要性。只有轻薄简洁美观的视觉呈现才能更多的吸引消费者，对于网络信息传达来讲具有重要的意义。

标签：

网页设计；简约主义；视觉呈现

F49

1 网页设计视觉流程筹划

首先，什么是视觉流程？通俗的讲，就是人们在观看网页时候的视觉路线走向。我们在浏览网页是时候通常是从第一感觉印象到具体信息传达，最后产生整体感官印象的过程。美国阿尔多斯.赫叙尼在《观看的艺术》中提到：感觉+选择+理解=观看。观看的第二步是从视野中选定一个特定的元素，进行下一步详尽的理解。这是他总结给我们看清事物的方法。

视觉流程是视线在观赏物体上移动的过程，而网页设计中的视觉流动路线是相当重要的，是设计师们不可忽视的关键因素之一。垂直的物体在页面上会引导人们的视线做上下的运动轨迹，水平的物体在页面则给我带来的是左右的视觉流动，三角形的物体会让我们的视觉由角顶开始做循环的视觉流动，而圆形的物体往往会让我们的视线呈辐射状运动。

因此，网页设计中不同的视区范围有着不同的注目度。我们浏览网页时一般的阅读习惯是从左至右，从上至下。也就是说我们在浏览网页时一般视觉流程是从左上角向下逐渐移动的，所以，我们一般会把一些重要的讯息，比如logo、通知、最新信息放在左上位置，通常我们叫这个位置为视觉中心。

2 影响网页页面视觉呈现的要素

2.1 网页页面的版面率

版面率指的是网页设计中文字、图形、图像、颜色等的占有率，它不仅影响页面信息传达效率，也决定着整个网页设计的视觉呈现效果。一般来说，版面率

与视觉传达效果以及设计创意成反比的。如图1、2所示。

我们可以看出，宜家的版面率低，整个页面几乎只有其logo的存在，所容纳的信息量少，但是给我们的视觉冲击力很强烈，视觉呈现的形式感很强。在网页设计中，极简的网页视觉呈现能够把最重要的信息以最直观的方式传达给浏览者，而且也可以起到一个避免阅读中分散注意力的作用。譬如，在一个纯白或是纯黑的页面上，出现的任何一个色彩都将会引起浏览者的注意，色彩本身也就成为了我们关注的焦点。“少即是多”在网页设计中同样也适用。如我们的一些个人网站、博客等商业气息不浓厚，大多都会以设计创意个性为主，版面率较低。选择版面率比较高的设计时，讲究空间的有效利用与秩序的合理划分，而且每一版面的大小和位置关系要和谐。否则要么排版呆板，要么秩序混乱。

2.2 网页设计的权衡布局及简化设计

所谓简约主义，顾名思义就是要我们将设计元素、色彩、造型进行简化。人们常说的“简约不简单”，实际上就是简约主义。目前，简约设计已经被广泛应用到我们生活的各个领域，无论是室内设计或是平面设计还是包装设计，都在实行“简约主义”。甚至很多品牌，譬如无印良品、宜家家居等都是采用的简约主义风格，无疑简洁时尚已成为人们广泛追求的一种风格。正所谓“简约不简单”，个人也认为越是简单的东西越大牌。

排版布局中的平衡、对齐及对比关系，对页面视觉效果至关重要。然而画面效果头重脚轻，或者左右失衡，则会让浏览者感觉到不适，心理上会造成一种束缚感和压迫感，从而影响到阅读者浏览信息的流畅性。

那么对于网页设计来说，要做到简化设计的第一步就是要去除一些多余的没有必要的东西，尽可能的丢掉他们，留下一下最为关键的信息，比如logo、介绍、导航等等。我们每天都在使用的腾讯，它的页面设计就做到了这点，如图3、图4所示。

2.3 颜色给我们带来的心理暗示

彩是我们认识事物的第一印象，我们在浏览网页的时候对视觉冲击力强的网页设计留下的印象最为深刻。因此一个好的网页设计必定有一个很好的页面配色设计，它不仅能更好的传达信息，同时还能更好的与大众的心理需求相契合，更大的发挥网页设计中带来的视觉效果，如图5、图6所示。

根据季节的变更、促销活动的安排以及各品牌不同的文化理念，常常要做一些不同的网页设计才吸引消费大众。因为人们在长时间浏览网页的时候很容易产生疲倦，在色彩的使用上，我们一般应将色彩对比放在一些需要仔细阅读或主要信息上，以免增加网页浏览者的阅读难度，引起视觉疲劳。同时，我们也不能采用一些辨识度低的颜色，尽可能把信息目标更快更好的传达到消费者的眼中。

不同的网站类型都有着自身的色彩语意相关性，譬如儿童用品的网页设计则

多使用一些明亮醒目的纯色，而一些高科技产业等互联网行业的网页设计一般采用蓝色为主。我们平时网上订餐的KFC、必胜客等页面一般都是采用的企业文化的标识颜色，以红色橘色为主，这样的暖色系更能勾起人们食欲。白色，因其明度最高，无色相，明亮干净、畅快、朴素，永恒无暇，在自然界象征着极致的纯净与贞洁。可以给人很好的轻快速度感，运用得当可以让其它任何浅颜色及亮颜色呈现出其深度、明度和饱和度的不同，通过对比让其亮色更加明快、专注和舒适。整洁、大空白的同时让用户保持欢快的情感进行浏览。如图7、图8所示。

2.4 空白不等于苍白

中国的传统美学所提倡“空白”，不是单纯的抽象、虚无，而是一种主观的感性的理性的感悟。页面变得苍白？是不是整版的文字缺少图片的点缀？其实适当的点缀是必不可少的。在适当保留重要的留白空间的同时，为配上一张与文字相契合美图吧，起到画龙点睛的作用。或者是给段落文字总结旁边添加一个小图标，示意其文字内涵。虽然使用空白多多益善，但也要尽可能的保证有对比感。设计师应使用最小的视觉变化来表达想法。事实上这就是意味着元素之间要有主次感，如图9所示。

其实透气的留白并不等于无力的苍白，让有趣并富有创意的大胆设计去刺激阅读者的视觉神经吧！让我们的网页设计变得更有趣味性，更有思想，更简约，但不简单。

3 结束语

在网页设计过程中，我们应继承我国的传统文化，形成独特的设计风格，拓展设计的视觉语言。与此同时，我们还要推陈出新，突出现代化，引领时尚潮流。以现代简约主义的手法对中国的传统元素和符号进行提炼和二次设计，让网页设计获得更强的视觉认知力和艺术感染力，营造一个自然、合理、顺畅的视觉流程，更好的激发人们的审美情趣，引导人们在美的享受中接受传达的信息，发现美好。

参考文献

[1]（美）鲁道夫·阿恩海姆.艺术与视知觉[M].北京：中国社会科学出版社，1984，（5）.

[2]孙娇，宗明明.网页设计中视觉流程筹划与应用[J].美术教育研究，2011，（7）.

[3]李湘媛.浅谈网页设计中的色彩语言表达[J].艺术教育，2012，（11）.

[4]万剑，丁洁琼.论平面设计中色彩的应用[J].职业技术，2006，（20）.