网页视觉设计的形式感表现

李静

摘 要：网页视觉设计关系到网站的用户体验。本文从整体视觉上谈论如何使界面设计增强形式感，以及如何适应当前快节奏下用户的视觉需求。本文以用户为基准，探讨一种基于用户体验的网页视觉设计的技巧和方法。

关键词：视觉设计；形式感 ；用户体验

中图分类号：TP393 文献标识码：A 文章编号：1005-5312（2016）24-0170-01

一、网页视觉设计的发展趋势

网页界面设计可以向传统的平面设计学习，如杂志版面。因为传统的平面设计有着较为悠久的历史，其发展较为成熟。由于当前网络时代的硬件及软件的日趋完善，网页设计环境较为自由，表现形式逐渐不再受束缚性，因此，可以通过向传统平面设计学习来增强网页界面的形式感。

（一）扁平化设计趋势

扁平化设计也就是摒弃一切装饰效果。所有的元素的边界都干净利落，没有任何装饰。扁平化的发展趋势有两个必然原因。第一，从用户角度来说，由于数码化程度越来越高，审美疲劳逐渐出现，用户越来越需要简洁的形式来完成自己的操作。第二，从技术层面，由于软件更新迅速，与其花更多时间制作拟物化效果，不如在交互与技术层面多花时间做出创新，从而更好的吸引用户。

（二）版式的节奏感表现

版式节奏感是在一个画面中强调和突出重点信息，强调信息层级和视觉流程。主要从三点来表现，因为网页中传递信息的主要内容是文字，所以可以从文字的大小、多少和粗细来表现。

1.大和小的配合。夸张的大字和小字的配合使用是杂志版式设计的一大特点，它使阅读和视觉定位更加明确，适合当前快速阅读的信息时代。在网页设计中也可以摒弃传统的网页设计的版式，采用大字与小字的配合，增强版面的节奏感。

2.多与少的配合。多与少的配合也就是常说的留白。留白并不代表一定要用白色，而是预留出一些范围来组织页面空间中的元素，组织页面中的细节。比如谷歌引擎搜索及谷歌产品，都较好的运用了留白的表现手法。

3.粗与细的配合。粗与细的配合主要体现在网页字体的高磅数和低磅数的配合上，以及留白处的细微设计中。网页设计之所以要向杂志学习，是因为杂志中对于字体的巧妙处理。在进行网页设计时要对所处理的文字内容进行归纳整理，先理清段落之间的关系，比如并列关系、流程关系，每段文字之间是否有相同的结构或相似的数据信息。之后要分析每个段落的结构，提取每个信息段落里的主要元素。

（三）背景大图的巧妙运用

超大图片是杂志设计中常见的表现方式，在这个读图的时代，图片能够更好的触动用户的神经。在网页视觉设计中，可以让整个视觉主打一张完美图片，交互和文字信息较为简单，图片尺寸根据宽屏大小自适应。交互菜单和文字信息通常默认系统字体，通过大小变化和位移来进行宽屏自适应的。在使用背景大图时需要注重图片的质量以及图片与内容的协调，如果配合文字使用，就要对文字所处的位置进行局部模糊、纹理色彩弱化、单色化等处理，或者在文字下方给予底色或半透明底色处理，拉开与背景的差距。

二、网页视觉设计的形式感表现技巧

（一）源于生活的设计灵感

将生活中的事物运用于设计之中，比如生活中的书本、桌子、足球、篮球等。这些事物通常具有丰富形态和和延伸意义。我们可以用这些事物来表达特定的主题。当我们拿到一个设计主题时可以通过它的生活原貌来激发灵感。比如，做一个足球的网站。可以选择运用足球这个实体作为主视觉，然后通过简化事物的手法对其进行提炼，在保留足球特征的情况下去除多余的元素，目的是为信息的呈现腾出更多的空间；接下来根据提炼出来的足球形态对信息内容进行规划；最后，网页内容基本呈现，可以适当添加一些气氛和视觉的补充，甚至可以在不干扰信息呈现的情况下还原足球的一些特征，使整个页面表现力更强。

（二）艺术化的残缺之美

残缺之美是一种推翻正常视觉习惯以达到情感集中并强化视觉冲击力的方法。非常规的视觉效果会给人们情感上的不平衡并产生冲动。因此，可以采用艺术话的残缺美给予画面一种特殊的视角并带给用户更强烈形式美感及视觉感受。这种残缺之美可以是缺口的酒瓶，断臂的维纳斯，被踩扁的易拉罐等，在网页视觉设计中，可通过选取局部，去掉局部及替换局部来实现。

（三）巧妙运用逆向思维

在设计过程中，设计者通常会听到这个部分再放大一些，色彩鲜艳一些，主题突出一些。网页设计中通常会有内容较少的页面和内容较多的页面，其中，内容较少的页面可以通过留白来丰富页面层次，使主要内容形成焦点；内容较多的页面可以通过加深层级关系或通过长页面来表现。长页面是在用户不跳转的情况下通过滚动获得所有的信息，它适合主题相对连贯的内容，或者在设计上使用连贯的创意以保证持续阅读。

三、结语

网页视觉设计是网站建设过程中的重要内容，其视觉设计方法会随着科技的发展而不断变化，无论如何变化要始终以用户为中心，满足用户的需求，在视觉上要注重网页界面设计的形式感表现，从而给用户营造一种愉悦的视觉环境，让用户达到身心的享受和共鸣。

参考文献：

[1]李晓宁.网页设计中视觉要素的运用研究[D].沈阳：沈阳建筑大学，2012.