网页设计中视觉语言审美性表现研究

前言：本站为你精心整理了网页设计中视觉语言审美性表现研究范文，希望能为你的创作提供参考价值，我们的客服老师可以帮助你提供个性化的参考范文，欢迎咨询。

摘要：网络作为一种新的信息传播载体，为设计者提供了新的艺术表现舞台。网页设计的核心美学价值是信息传递，图文与信息的传达要满足人们的审美需求，更需要一个系统的、强有力的理念基础做支撑。在多元化的视觉设计时代，针对网页设计中文字、图形、色彩、版式设计等方面的应用研究，能够使人们加强对网页设计审美规律的认识和理解，有助于使网页具有鲜明的审美价值，满足浏览者的视觉审美需求。

关键词：网页设计；视觉语言；审美性表现

随着信息时代的迅速发展，网络早已成为一种新的信息传播工具，与现代人的生活息息相关，成为人们生活中不可缺少的一部分。目前浏览者对网站视觉艺术设计的审美要求越来越高，新的网站层出不穷，很多网页设计包罗万象，各有特色。网页设计的核心价值是信息传递，图文信息的传达需要满足人们的审美需求，更需要一个系统的、强有力的理念做支撑。在多元化的视觉设计时代，针对网页设计中视觉语言的审美性研究就显得非常必要。鲁道夫在《视觉思维》中提出：“视觉具有选择性，这样就可以使浏览者的注意力集中在最喜欢的东西上。”[1]58生物通常会被环境中充满美感的事物所吸引，通过视觉分辨事物的好坏，做出反应，从而决定是否观看欣赏。网页设计中视觉语言的表现能否吸引人们的目光，在于其形式内容的审美性表达效果以及视觉元素的形式原理在网页设计中的具体应用。只有强调技术与艺术完美结合，才能有效地面向未来的网页设计，满足广大浏览者的视觉审美享受。

一、网页设计中文字的审美性表现

文字在网页版面中占据大量的空间，是网页信息所用的主要形式。文字不仅是网页中信息传播的主要载体，更是有效信息传达最直接的途径。为了更好地传达信息，在进行文字设计时首先要考虑是否给浏览者清晰的视觉印象，其次一定要避免复杂凌乱，在字号的大小上要做到恰到好处。虽然电脑中可选择的字体很多，但是字体的风格要统一，种类要精简，视觉上需要强调清晰、舒适感。除此之外，还要斟酌文字的大小、疏密、用色等的变化，以此来体现设计者对文字的审美表现。所以设置与选择字体在网页设计中显得非常重要。

（一）文字的大小、字体与行距设置

网页设计中文字要根据网页版式中的信息内容进行设计，通常状况下网页正文的字体大小设置为12磅左右，这是最适合正文的字号。网页版式设计是通过文字的变形、组织、图形化来表现的，设计者应统筹规划，通过字体的巧妙应用使浏览者观看网页时能感受到版式的审美性与创意性。还可以利用字体属性将文字的方向、大小进行变化并组合在一起，加强视觉节奏感，增强信息传达效果，给人以生动活泼的美感。对文字的设计首先要了解字体的个性特征，汉字的基本字体是黑体和宋体，在网页版式设计中使用最为广泛。正文与标题文字的字体选择要考虑是否与主题情感表达相呼应，正文字体需选用中性情感的表述方式，不宜表达过分的情感体现。网页设计中对文本的可读性产生很大影响的因素便是文字的行距变化，行距可以大致分为正常、紧凑、疏密三种类型。一般情况下，比较适合正文的行距是接近字体的尺寸大小。行距的常规比例为10:12，这主要是因为行距过宽会导致一行文字失去较好的延续性。行距本身也是具有很强表现力的设计语言，标准的行距设置会在版面中形成有效的平行空白带，容易产生视觉上的秩序感，能引导读者的目光。在进行文字设置时，可以有意识地调整版面的行距，通过加强视觉弹性与空间层次来表达轻松舒展的情绪，增强文字的可读性与审美性。[2]32

（二）文字的整体编排

网页设计中文字部分的标题位置一般在整篇文章之首，但这不是不可改变的，有时需要做横向、居中、竖向等编排调整，不过需要了解字体效果，这种效果可以影响并强化文字的含义。正文中文字需要从左到右对齐，这样既符合人们的阅读习惯又能使文字显得美观、严谨、自然，反之则因不太符合人们的阅读习惯而很少应用。排版时如果文字较少，可以把整行文字作为编排构成元素中的线来看待。这种编排方式使网页中文字产生对称的形式美感，更加突出，很方便浏览者阅读。标题与正文要区分字号大小，主要信息和次要信息也可以用字体的粗细区分，这样就因疏密虚实在视觉上显得飘逸跳跃，增强了文字的节奏美与韵律美。如果将文字绕图形编排，会令人感到融洽、自然。

二、网页设计中图形的审美性表现

优秀的网页除了具有充满美感的文字形式之外，图形的表现功能也不可忽视。图形属于直观表达形式的视觉语言，图形在网页中占据了比较重要的位置，能引起人们的视觉注意力，增强阅读的兴趣。在现今的网络中可以用图文并茂的形式向用户提供信息，在加大信息量的同时也要加强图形与文字之间的组合。如果文字或者图形中某个元素过多，网页就会显得不舒畅而失去生机。所以要根据网页的内容按照审美原理运用图形，美化网页的版面效果，提高网页的美学价值，给人比较强烈的视觉信息。

（一）网页设计中图像的设计表现形式

现代网页中的图形语言在应用中是多元化的，如通过摄影、手绘、电脑制作等多种方式来完成网页中的图形设计，表现网页主题。网页设计中图形的选择要以能够体现设计者的审美性和强化网页视觉表现力为主，对选择的图形应该从数量、像素大小、位置及主体方面考虑，力求使画面和谐而又有变化，这样才能最大程度上强化网页版面的视觉表现效果。在网页设计中进行图形编排设计时，设计者要依据版式的内容与形式找到适合版式语言的图形，遵循审美规律，设计要人性化，这样才能有助于信息传达。在网页设计中静态图像的表现形式主要有出血图、方形图和退底图。出血图是图像充满版面、无边框、一边或几个边向外扩张和舒展的图像，其表现特点是充满页面而不受边框限制，给人的视觉感受是与人更加接近，便于情感交流。方形图则是以直线边框来限制和规范，是一种比较简洁单纯的形态，在网页设计中比较常见，能够使主体形象与环境共融，图像页面中方形图最能体现静止、严谨和庄重的视觉风格。将精选的图像沿边缘裁切后保留轮廓，有选择性地保留主题形象需要的视觉形式的图像为退底图。退底图表现个性突出，形式更加自由，图像在页面中彰显动态、活泼和轻松的视觉风格。在网页设计中应用退底图可以使图文结合自然，产生较强的亲和力，容易给浏览者留下深刻的视觉印象。

（二）网页设计中图形的编排构成表现

图形在网页设计中的引入大大美化了网络页面的美感，起到了装饰、点缀页面的效果。图形是网页设计中最直观的传递信息的语言，图形的位置、形式、方向直接关系到网页的视觉传达效果。特别是在处理和相关文字编排在一起的图像时，更需要注意图形的编排表现。在版面构图布局与排版中，四角与对角线共同支撑版面的结构与形式，具有潜在的重要性。其中版面各边界连接的四点构成四角，分别经过版面中心边界的端点；连接四角的对向斜线为对角线，对角线交叉点就是版心。在版面设计布局时，四角与对角线可使版面的结构形式产生丰富多变的构成特点，可支配版面的中轴四点。中轴四点是分别经过版式中心的水平线和垂直线的端点，四点可向上下左右移动调节，产生横、竖、居中的分布形式。四角与四点的合理应用可使版面形式得到有益补充，同时把握好空间布局结构与图形的主次分布，从而使版面构成更加丰富、完美。

（三）网页设计中图像的处理

网页设计中静态图像的表现通常由表现内容决定，而选用图像的数量、形状、大小则与网页背景色面积大小在视觉上要比例协调。图像的外形能使页面的氛围发生改变，一般而言，方形稳重、严肃，圆形或曲线外形柔美、动感，三角形彰显锐利，退底图及一些不规则或不带边框的图像显得活泼。图像的形状直接影响浏览者的兴趣，图像的大小由其需要表现的重要程度决定。在一个页面中，视觉焦点位置的大图像较能吸引视觉目光，更能传达强烈的情感交流；小图像既小巧精致又简洁可爱，穿插在大量文字排版中更能呼应主题、点缀页面。图像大小的运用体现了页面设计的和谐均衡与对比变化，也避免了因页面中只有大图像而显得单调无聊和只有小图像或文字而显得平淡乏味。[3]65-67一般情况下，应根据主次关系合理安排大小图像，这样才能使页面主次分明、对比强烈、生动活跃。这样的设计能够吸引人们的视线在页面上流动，使浏览者得到舒适的观赏体验。因此，优秀的网页设计页面应该增加主体图像所占空间，缩小次要图形面积，使图像主次分明，大小图像穿插、组合合理，从而得到最佳的视觉应用及表达效果。

三、网页设计中色彩的审美性表现

在网页设计中色彩的运用起到至关重要的作用，而且色彩的审美性是影响浏览者视觉心理的有效手段。对色彩的选择与综合运用能够体现网页的审美标准与形象内涵。为实现吸引客户和传达信息的目的，网页设计中的色彩运用可以更加丰富但不能太多，色彩太多容易造成页面眼花缭乱，没有主次；纯度也不能太高，否则会造成浏览者的视觉疲劳。色彩的运用要恰如其分，使页面更活泼，不能喧宾夺主。所以设计者要掌握色彩的审美原理，最大限度地发挥色彩在网页设计中的作用。

（一）网页设计主题色彩的确定

网页设计中色彩的应用由网页主题决定，不仅要保持整个网页色调的统一，还要运用辅助色使内容整体中有变化，增强视觉美观性。不同的色彩搭配使浏览者得到不同的视觉情绪。通常状况下网页主题色彩的确定来源于企业视觉识别系统设计中的辅助色和标准色。标准色的确立及选用要能够体现企业内涵及形象特征，主要用于企业形象视觉识别系统及标识等一切宣传物品，网页设计中主色块和主菜单也使用标准色。辅助色则在这个系统中起到修饰与点缀的作用，网页主题色彩的确定便来源于这个系统。[4]102因为主题色彩能够在网页中最有效地传达企业的经营理念，不能为了网页的标新立异而轻易改变一个企业视觉识别系统中的标准用色。如果一个企业的标准色只限于一种颜色，运用在网页设计中就会显得单调乏味，色彩不够丰富。遇到这种情况可以用辅助色来点缀页面，形成色彩对比效果；或者可以调和标准色的明度与纯度，这样既可以达到色调统一的效果，又能使页面色彩活泼生动。网页色彩设计还需要强调视觉冲击力，此外还要注意色彩的统一性，给人以整体统一的视觉感受。因此在网页设计时，通过企业形象来选择网页主题色彩风格，确定适合传播产品价值的色彩，才能突出网页设计的独特个性。

（二）网页设计中色彩应用的基本方法

网页设计中对于色彩的运用并不是越多越好，一个页面中不需要采用过多的颜色，通过调整色彩属性，在页面中产生各种变化，就能达到美化网页的目的。网页色彩设计的基本方法包括单一色、相邻色和对比色的基本运用方法。在网页设计中采用单一色会造成单调乏味的视觉感受，因此尽量避免采用单一色彩，一般情况下可通过调和某种色彩的透明度或饱和度，使其在同一色系中产生变化。另外在所有色彩中，白色和黑色是比较特殊的颜色。白色又称无色，如果将这两种色彩进行调和使用，就可以产生所谓的高级灰色，灰色与其他色彩搭配使用会产生很好的视觉效果。相反相邻色就完全不同，相邻色是在色彩对比中位置较近的颜色，如红色与紫色、黄色与黄橙色互为相邻色。采用相邻色可以使网页设计在视觉上既能达到色调和谐统一，又能避免色彩过于杂乱，使网页色彩能够在秩序中产生变化，增强节奏感。例如设计导航条的色彩时，就可以运用红色与黄橙色这组相邻色来表现。此外还有对比色的运用。对比色可产生强烈的色彩效果，是极富表现力的方法，也是重要的色彩表现手段，在网页设计中常用色彩对比来表现界面，可以达到突出重点的目的，使网页色彩鲜明，极具特色。通常状况下设计者可选用一种颜色为主色，对比色为辅，点缀修改，从而起到画龙点睛的效果。

四、网页界面版式设计的审美性

版式设计是网页界面设计的主要构成因素，也是重要组成部分。它将文字、图形、色彩等组合配置，使网页界面视觉效果雅观悦目，既利于阅读者浏览，又便于实现信息传达的绝佳视觉效应。网页版式语言体现页面设计者的品味和网页的内涵，这是由其属性决定的，版式语言的风格与网页属性相互联系，密不可分。页面版式语言的差异体现其属性的不同，在设计中需要将不同的表现形式与丰富多样的内涵体验结合起来，构成色调统一、整体视觉效果良好的网页界面。网页设计的气质特征通过网页界面的设计及版面风格来表现。根据其所表现的对象，需要表达的功能与设计目标等与版面内容相符，通过这些属性来表现版面设计的审美性特征。例如应用商品类网页的版式要接近人们的实际生活，体现现实特点；政府机构的网页在形式上要简练、稳重，体现行业的特点；科技类网页版式要谨慎、严密。[5]85这些都是根据网页的内涵属性来确定的。因而可以说文字、色彩、图形的运用决定网页属性。设计者必须对网页内容与主题进行深入了解，并找到最适合该网页内容的版式设计与尽善尽美的表现方法，这种设计方式具有独特性及专用性的审美特征。版式设计的界面形式是内容的载体，但又具有独特的艺术审美形式。形式美包含网页设计的版式构图、整体布局和色彩等所传达的风格特点，因此网站的设计风格与定位根据信息内容的不同来决定它的属性。网页设计的特有目标及价值不仅通过形象、直观、便捷的浏览方式呈现，更是以美观独立、清新自然的界面版式来表达体现，这样才能突出网页设计的独特性与审美性。

五、结语

网页设计作为当前设计领域中新型的设计艺术，在遵循美学原理的同时应当同样重视设计中视觉语言的审美性表现。因此，以视觉语言在网页设计中的应用为主要研究对象，掌握网页设计的表现精髓，加强审美规律的认知和理解，总结网页制作的经验并将其融入到设计者的思维中来指导网页设计，使网页具有鲜明的审美价值，满足浏览者的视觉审美需求。

参考文献：

[1]鲁道夫•阿思海姆．艺术与视知觉[M]．腾守尧，朱疆源，译．成都：四川人民出版社，2006．

[2]何苏六．网络媒体的策划与编辑[M]．北京：北京广播学院出版社，2001．

[3]冯晖．网络广告实务[M]．北京：中国水利水电出版社，2009．

[4]彭刚，周绍斌．网页艺术设计[M]．北京：高等教育出版社，2008．

[5]梁景红．设计师谈网页设计思维[M]．北京：电子工业出版社，2006．

作者：王永虎 杨广红 单位：巢湖学院艺术学院