新媒体语境下网页设计的视觉艺术性提升方法

王丹

摘 要 随着“互联网+”时代的到来，人们与网络的接触更为密切；与此同时，人们对网页设计的形式美感也有了更高更新的要求。本文从艺术的角度探讨了网页设计时所需注意的视觉设计基本准则，在基于“技”的基础上，为网页设计的“艺”提供了新的指导方法。

关键词 网页设计；视觉形式美感；平面设计；美学原理

中图分类号 G2 文献标识码 A 文章编号 1674-6708（2017）193-0059-02

1 网页设计概况

网页作为网络发展和生存的必然产物。距离第一个具有现代意义的网页在互联网出现距今已有二十几年的时间。网页设计的发展大致经历了3个阶段：第一个阶段，纯文本静态网页。作为人机交流的媒介，最早的网页由字符组成，只能保存单纯的文本，只追求传递信息的实用功能作用，对网页的艺术设计要求低。使用人群主要是一些科学工作者。第二个阶段，图文并茂的网页。1990年发布的第一个图形化浏览器“Word Wide Web”，使图像、声音、动画、视频、甚至3D技术开始在英特网上流行起来，网站的内容开始变得丰富起来，逐步由以技术为主，转而走上技术与艺术相结合的道路。第三个阶段，动态交互式网页。当代动态交互式网页的实现是基于AJAX技术实现的，主要是改善了实时交互的体验。动态交互式网页无论是在功能使用还是外观审美上对开发设计人员都有着更高更新的要求，也引导着网页设计的未来发展趋势。

2 新媒体语境下网页设计的视觉艺术性提升方法

网页设计是传统平面设计在以网络为载体的新媒体语境下的延续，为传统平面设计提供了更广阔的发展空间，同时，也让其自身的视觉表现有迹可循。因此，在探讨网页设计的视觉艺术性时，可参考平面设计的美学法则，从根源上解决网页设计作品艺术表现力弱的问题。

2.1 色彩应用的和谐一致性

在网页众多元素中，色彩元素往往是首先吸引浏览者目光的，它的效果直接影响阅读者的观赏兴趣，色彩运用的合适与否直接关系到网页视觉效果的好坏。不同的色调会在人的心理上产生不一样的视觉感受，设计者可以将这种感受结合VI设计理念，为网页制定主体色调，运用到不同的网页设计中去，和其他的基本要素一起构成统一的风格特征，以此凸显企业或品牌特色。比如，冷色调通常会给人理性、严谨、冷静的印象，所以蓝色在一些电子、电脑、汽车等高科技类的网站设计中被广泛应用；而绿色因其具有自然、和谐的色彩特征被认为是健康的标志性色彩在各医疗健康网站中得以广泛应用。

在网页设计中，色彩的作用还表现在可以通过微差法，丰富界面的色彩元素，在突出主体信息的同时，点缀和丰富网页的界面色彩视觉感。又或利用色块法，将不同栏目的内容进行区分，让浏览者更快速找到所需浏览内容。当然，网页设计的色彩应用应区别与传统平面色彩应用，颜色种类不宜超过3种以上，避免画面过于凌乱，人的视觉焦点会无所适从。

2.2 基本构成元素的别具匠心性

网页设计构成的基本元素主要有：图形、文字、以及以新媒体为载体的视听元素（影视、动画、音乐）。基本元素的合理创意化设计是网页与网页之间相互区别以及脱颖而出的重要因素。以艺术设计观点而论，设计者在进行网页界面设计时应注意以下三点。

2.2.1 图形的创意表达

在以图形来讲解信息的时代，图形给信息传递带来了重要的影响。网页设计中图形的应用形式主要有BANNER广告、产品图片以及导航视觉符号。不同的图形在其应用领域都有各自的特色，以编排在网页最佳视域中的横幅BANNER广告为例，此类图片，主要用以宣传最新产品或服务，其色彩和内容的独特性，是吸引浏览者注意的第一要素，因此要格外考虑其本色设计结构与原创性，呆滞的横幅版面或从素材网站复制的素材，都可能让整个网页界面黯然失色。而产品信息类的图像，则要考虑整体色调的归整和和谐性，若产品较多又不想缺乏独特感，可适当应用瀑布流结构，让整个画画，具有动感。导航类视觉符号的设计，应简洁具有抽象概括性，能明确表达文字诉求的同时，具有企业文化特色和本土气息。

2.2.2 文字的艺术设计

由于网络载体的特殊性，网页设计的文字一般以宋体和黑体为主，字体的设计，常常被设计师忽略。本文所倡导的字体艺术化，主要是指以图片为载体的说明性文字的艺术设计，这类文字一般以标题文案出现与banner广告共存，结构合理、形象贴切的字体设计更加具有娱乐性和视觉冲击力。此外，在许多国外的网页设计作品中，艺术字体也被广泛应用于首页导航设计中，以突出界面的独特性。

2.2.3 视听元素的个性化设计

视听元素是网页设计区别与传统平面设计的重要特征。现代互联网技术的高度发展和宽带接入的提高，逐渐形成了现在以flash视频为主的流媒体视听元素。首先Flash视频的载入以动态图片的形式体现可以减少用户的等待的焦虑感，亦可以结合网站品牌的logo予以设计或以趣味动画的形式体现增加品牌的认知感。其次flash的用户交互区要和视频或者网页的整体色调相匹配。Flash的弹幕元素也是设计师关注的重点。弹幕不能影响视频观看是设计弹幕出现方式的首要考虑，弹幕一般有防挡字幕和合并重复弹幕的选项。弹幕的颜色也可以设计成多彩弹幕和动态图弹幕，带给弹幕参与者更多乐趣。

2.3 版面构成的合理创意性

网页的版式设计主要包括用户界面和设计风格，体现了网页设计者对网页内容的安排，对网页内容的理解。首先，一般网页为了吸引读者的注意，会将重要内容放在显著的位置，如版面的中部或上方，而底部和两侧放置次要的内容。此外，为了整体版式的美观与逻辑严谨性，会以栏目形式将相同内容放置于同一区域，重点内容会以色彩区分。其次，内容布局的均衡与统一、节奏与规律、调和与对比性也是设计者进行网页设计时所因考虑的。最后，虽然版面构成的法则具有统一概括性，但在实际网页设计时应根据网页呈现内容多少及类别进行灵活应用。比如：

1）门户网站大多选用国字型版面，国字型网站可以把网站划分多个区域，对内容复杂，新闻种类繁多的门户网站来说是很好的选择，而且国字型版面排列整齐可以彰显网站的大气形象。

2）导航网站和门户网站同样内容复杂，但导航网站相比门户网站用户粘性较低，GA（用户平均停留时间）明显低于门户网站。鉴于此导航选用布局更为简单的口字型版面效果更为理想。

3）兴趣爱好类网站的版式选择比较灵活，现在流行的瀑布流式布局是不错的选择，瀑布流没有呆板的格局划分，不会限制网页展示长度和各模块的展示内容，用户长时间浏览也不会感到疲倦，大大增强网站的用户粘性。

4）电商网站是现代网页版面进化的综合体现，现代网页为满足实际需要不再拘泥于原始式版面设计框架，有自己的改进特色。为满足商品种类繁多以及优化用户操作体验，有些电商网站会把原来是banner导航栏放到侧边，给予自种类足够的展示空间也免去用户手动Hover触发子类别的烦恼。

3 结论

约瑟夫·鲁曾说过：“一切精美的东西都有其深沉的内涵。”网页作为网络信息表现和思想传播交流的主要形式，不应只是“技”的探讨，“艺”的形式美感也是每一位从事网页设计工作者需要认真思考的课题。本文提出的加强网页设计视觉艺术性方法，是考虑网络载体与传统纸媒載体不同之处的基础上，从网页界面设计形式美感的根源出发，借鉴传统艺术设计的美学应用技巧，解决网页设计者迷茫而又容易忽略的界面形式美感问题。

参考文献

[1]宋春晖，网页设计中的美学应用分析[J].海南师范学院学报（自然科学版），2005，18（1）：46-49.

[2]黄海燕.网页设计与平面设计[J].包装工程，2004，25（1）：126-127.

[3]杨旭兰，色彩在网页设计中的应用研究[D].南京：南京林业大学，2009-06-01.

[4]李多，网页的视觉传达与设计表现研究[D].河南：河南大学，2009-03-01.

[5]鲁道夫·阿恩海姆（RudolfArnheim）艺术与视知觉[M].四川人民出版社，1998.