版式设计在网页设计的应用

前言：想要写出一篇引人入胜的文章？我们特意为您整理了版式设计在网页设计的应用范文，希望能给你带来灵感和参考，敬请阅读。

摘要:信息技术的发展为现代社会带来新的发展机遇。作为人们分享信息、获得资源的主要途径，网站逐渐受到人们的重视。美观独特的网页可以吸引浏览者的注意力，让其印象深刻。通过深入研究如何在网页设计中合理运用版式设计，分析网页版式设计的特点、网页版式设计的原则及版式设计在网页设计中的作用等相关问题。

关键词:版式设计;网页设计;视觉传达

一、网页设计与版式设计

(一)网页设计

网页设计是在互联网及数字技术发展中产生的一种新艺术形式。它是以互联网为载体，以网络技术和数字技术为基础，依照设计目的，遵循艺术设计规律，实现设计目的与功能，强调艺术与科学密切结合的一种艺术创造化视觉传达活动［1］。在网站运营中，精美的网页设计是提升网站知名度、增加浏览用户以及推销自身的重要载体。它是网络视觉艺术的主要表现形式，也是当代设计艺术的重要组成部分。

(二)版式设计

今天的人类生活到处都离不开版式设计，无论书刊、报纸、网页设计，还是巨大的建筑或公共环境，都是版式设计的典型代表。可以说版式设计是现代设计艺术的重要组成部分，是视觉传达的重要手段［2］。版式设计是艺术专业的必修课，适用于包装设计、书籍设计、网页设计等专业课。将版式设计与网页设计有机结合在一起，恰当地运用版式设计法则将各元素组织起来，可以使网页中的各种视觉元素进行科学合理的排列与组合，兼具思维逻辑性与艺术性。通过不同的版式编排，网站会呈现各自的特色，给浏览者以赏心悦目的视觉享受，从而使浏览者印象深刻，对网站起到良好的宣传作用。

(三)网页设计中的版面视觉特点

网页是浏览者通过电脑、手机等电子设备进行信息浏览的一种载体，在版式、文字、图形、色彩的运用上与传统纸质媒体版式存在明显区别。网页上还包含超链接、按钮等组件，因此在设计过程中需要结合浏览者的阅读方式进行文字安排，如按照网格线进行纵向文字排列来适应浏览者通过按键上下滚动页面进行阅读的方式。由于网页具有跳动性，为了缓解浏览者的视觉疲劳，要选择合适的字体及字号，内容要清晰概括，符合网页设计中版式的视觉特点。

(四)网页设计中的版式设计原则

1．合理编排和布局

网页内容通常包含文字、图片、链接、一些流动的窗口及附加广告等，巨大的信息量经常会让浏览者感到眼花缭乱。这就需要设计者进行合理的安排和布局，使页面上所有内容能组成一个有机的整体，让浏览者能够进行合理阅读。

2．突出设计主题

许多优秀的网页之所以让浏览者感觉美观大气，主要得益于其主题鲜明、版面清晰的版式设计。从页面结构的分割和造型空间的确立入手安排网页元素的位置，可以突出版式设计的主题效果，使浏览者快速地记住页面信息。如很多购物APP的首页上会比较明确告知浏览者什么物品属于什么分类、什么货物最吸引人等，主次分明的构成可以方便消费者快速选购。

3．符合视觉及心理特点

浏览网页的过程是一个对视觉元素所传播信息的认知过程，这要求设计者在进行网页设计时要将人们在视觉、心理和生理方面的特点考虑进去，并以此为依据确定各种元素间的视觉关系及浏览秩序［3］。同时，设计者应根据这种特点引导浏览者的浏览顺序，达到重点宣传的目的。设计时需要注意保证信息的有效传达以及突出主要信息，这样才能吸引浏览者保持兴趣进一步浏览下去。

4．适应网页的动态化特征

网页由各种版块构成，虽然网页内容各异，但都是由一些基本版块组成，包括Logo、导航条、Banner、内容版块、版尾等［4］。伴随数字媒体技术的发展，网页因其动态化、交互性及参与性的特点吸引越来越多的浏览者观看。这主要就是利用网页信息的动态更新和即时交互性，达到引导浏览、吸引浏览、增强参与性、互动性的目的。网页信息的每一次更新，都需要设计者根据网站的主题、作用及各内容版块，配合网站不同阶段的主题［5］，以及用户反馈信息进行有效及时的更新，更新过程中还需要对设计方案进行调整与修改，以便满足不同阶段人们对网页的审美需求。

5．色彩运用得当

色彩在任何的设计中都有着举足轻重的地位，运用色彩的基本原则可以总结为“总体协调，局部对比”。人们总会被鲜艳的色彩而吸引，在网页设计中色彩搭配要从整体性出发，先确定主题色调，再进行上下级页面以及各栏目的色彩搭配。通过合理变换局部设计色彩与整体版式主色调协调统一，以及通过不同色调来划分不同的网页内容或栏目等，都是网页设计中运用色彩提升浏览者关注度的一种方式。

二、网页设计中各元素的版式编排关系

(一)视觉要素在网页中的版式编排关系

网页作为浏览者获取信息的重要途径，首先，要让浏览者对触目所及的信息有全面的了解，节省思考或查找的时间，也就是要求网页的版面设计能够具备主题明确、信息有序、构图合理等特点，以便浏览者迅速掌握相关信息。

1．网页版式设计中的色彩要素

色彩可以对人们的心理产生相应的影响，比如人们常见的交通信号灯，“红灯停，绿灯行”已经成为人们的基本认知。在互联网中，色彩对人们的心理联想作用依然存在，比如，看到明快的黄色会想到食品网站，看到厚重的绿色会想到环保网站等。基于此，在网页的版式设计中可以恰当地发挥背景色、基本色、主色等的心理联想作用，配以图形、文字、动画等各种网页元素，统筹兼顾地围绕网站主题突出效果。从而使网页展现出或清新、或前卫、或古朴、或稳重的特点，让浏览者能够较快地感受到网页所展现的主题，同时大面积的色彩运用还能够起到划分版块的作用，使网页上的内容主次分明，主题更加明确。

2．网页版式设计中的文字要素

网页中的导航条、Banner、主标题、副标题、文章内容及广告语等文字元素［6］，是浏览者获得信息的主要来源。因此，在网页设计中应更注重文字的字体、字号、文字样式等的编排。通过风格迥异的字体及各级标题字体大小的设置让网页内容显得更有活力，同时通过各级标题内容字体大小的区别，也可以让网页显得更具有条理性。比如，网页中广告部分的内容文字就可以设计成一些艺术字体，使其更加的醒目，也可适当地加入一些立体、动画等效果增加关注度;在网页正文内容的编排上就需要应用易读、易识别的印刷字体，同时用心规划各版块内容文字的行距、字距等版式关系，使浏览者不会因为文字过多而产生厌弃感或阅读障碍。

3．网页版式设计中的图形要素

图形是人类早期用于交流和记录的载体，现代社会由于生活节奏不断加快，人们更愿意通过图形来接受和表达信息。纯文字语言构成的网页已经远远不能满足浏览者的实际要求，也无法对网站本身做出有效的宣传及展示作用。纵观各大网站的网页都在根据自身网站的主营特点进行图形化的处理，比如，资讯类站点考虑到主要功能在于浏览信息，所以图片数量可以少而精;而企业宣传网站就应选择使用大量变化多样的图形，以期对企业起到较好的宣传作用;一些主题网站的文字导航条以及各类功能按钮为了让浏览者更直观、快速地了解信息内容也都进行了图形化处理。

(二)网页版式设计中的编排原理要素

在网页的版式设计当中，其包含在内的文字、图形、链接、按钮等都需要进行版式编排。首先，利用视觉的整体性突出网页设计的中心主体，可以利用一些图形、线条、字体及颜色进行区分，中心主体的体现主要来自于版式编排的主次分明、逻辑清晰，比如网页中主体内容与背景色的关系、内容中主要内容和次要内容的关系等。其次，考虑到浏览者视线移动的多变性，可将网页主要分为“国”字型、T型、标题正文型、左右框架型、封面型、变化型等类型。再通过视觉流程的多样化运动过程使得网页版式结构变化更加多样［7］。再次，要遵循版式设计中视觉的移动规律、视觉的错视和视觉生理心理等，提升网页设计的视觉效果使之能被更多的浏览者所喜爱。

(三)网页版式设计的形式美法则

网页从根本上来说是由字符、线条、色彩、空白、图片、符号等元素组合起来的供浏览者获取信息的页面，即网页中的视觉元素都是点、线、面、体的构成形态。其在应用过程中大多是根据内容的主次关系来有针对性地使用形式美的法则，通过黄金比例分割、对比调和、节奏与韵律等手法使网页在视觉上给浏览者以整体、秩序、层级清晰的感受。比如，可以利用人们视觉流程中的最佳视域作为中心来凸显主体要素，构成多视点、多层次的多维立体网页空间，使网页的视觉元素与识别符号更整体、更和谐、有效地传达信息，深化网页的媒介性和变化性。

三、结语

互联网的飞速发展使人们越来越重视网页设计的视觉效果，可以说网页的美观与否，与其版式设计有着直接的关联。因此，在进行网页设计时，设计者需要遵循版式设计的原则，合理运用版式设计方法，协同视觉语言、图形语言及视觉因素原理的应用，设计出更加突出主题、生动有趣、视觉冲击力强的优秀网页。

【参考文献】

［1］薛文勇．浅谈网页设计中的版式设计［J］．西部皮革，2017(18):79．

［2］陈江龙．浅谈平面设计中版式设计的构成与应用［J］．大众文艺，2011(2):73．

［3］樊歆．版式设计在网页艺术设计中的分析［J］．辽宁丝绸，2017(4):40－41．

作者：张帆 单位：哈尔滨职业技术学院