版式设计毕业论文

下面是小编精心推荐的《版式设计毕业论文(精选3篇)》，供需要的小伙伴们查阅，希望能够帮助到大家。摘要：目前全球进入了多元化信息时代，现代的读者也是多元化的读者。书籍版式设计的目的是通过特定的富有鲜明个性的版面形象来刺激读者，激活、激发读者的阅读欲望。而要完成这个目标的基础是很好的运用排版将信息完善的传达给读者。笔者通过对书籍版式设计的视觉中心、间隔控制、整体联络以及层次等方面总结出版面设计的要点研究，理论结合实践进行科学研究。

第一篇：版式设计毕业论文

版式设计课程的应用

【摘 要】根据公司宣传册版面设计的设计特点和要求，结合保险公司宣传册的制作实践，对宣传册中的封面设计、目录编排、版式设计、插图与色彩几方面进行了分析与探讨。掌握好每个环节的设计要求就能设计出深受广大消费者喜爱的宣传册。

【关键词】公司 宣传册 版面设计

宣传与广告可以说是公司生存与成长必不可少的一项重要事务，在互联网发达的今天，许多公司都开展了网络宣传与网络销售。尽管如此，纸质的宣传册仍然是一项重要的宣传项目。它既沿袭传统，追求一种简单明了、端庄大方的格调，让宣传册在质朴中显示端庄、显示条理、显示美感。同时由于携带方便、易于派发、贴近大众而广受公司宣传之青睐，可以满足广泛的社会消费群体，且可以轻松阅读，必要时可满足反复查对的阅读需求。

公司宣传册作为一种视觉宣传媒体，版式设计是其信息传达、视觉承载、阅读过程、整体形象、文化品位的表达，这对于公司形象的宣传至关重要;是建立在视觉科学、阅读规律、市场营销之上并对其有良好促进作用的系统工程。版式设计首先从内容的选择到内容主次排序，从封面、封底的设计到大小标题的罗列、图片的选择、色彩的搭配等，都是为了营造一个轻松、快捷、顺利的阅读与理解的资讯空间。既要重点突出又要丰富多彩，使红花绿叶相映生辉，使易读性与喜读性相结合，最终达成宣传公司、宣传产品的目的。本文结合版式设计的课程知识，将其应用于保险公司宣传册的制作这一大学生社会实践中，就公司宣传册中的封面设计、目录编排、版式设计、插图与色彩谈几点体会。

一 公司宣传册封面设计

1.封面设计要求及其特点

作为一本刊物，封面一般由封一、封二、封三、封四和书脊五部分组成。由于公司宣传册一般较薄，因此书脊部分无法体现，在封一到封四中最重要的就是封一，即一般俗称的“封面”，其次是封四即“封底”。宣传册的设计有它特殊的要求及其特点，封面可以说是重头戏。首先封面的全景设计要有创新性，即体现出个性与特色，当然这种个性特色既要符合视觉美学的规律，又要与所宣传公司的性质、名称、内涵相呼应，通过文字、图案、色彩以及构图处理，体现公司宣传册的性质，引人注目的封面往往能够增加阅读的意愿。

2.封面设计艺术元素及分析

封面文字是构成封面设计必不可少的要素之一。公司宣传册的封面文字一般要体现出简洁性，要将公司名称置于醒目位置，同时用简洁字符点明公司性质及宣传内涵，让人一目了然。

封面图片与色彩则是形成视觉冲击力的设计要素。当然不能为了单纯追求视觉冲击力而随意添加一些怪异、另类的图片，或用杂乱的明色调进行堆砌，这会让人看了有“丈二和尚摸不着头脑”的感觉，不知这些醒目的图案该怎样与所要宣传的公司联系起来。其实封面的图案与色彩直接为封面设计定下了一种基调，或清新淡雅，或充满温馨与关爱，或张力四射蕴含催人奋进之力量，或朴素自然。要将图案、线条、文字符号等因素协调统一的组织搭配好并非易事，从中可以体现出构图设计的技巧。

以笔者所设计的公司宣传册的封面为例(见图1)，其中的设计构思如下：

第一，将封面与封底进行连贯设计，一则是从美学的角度考虑，连贯性的图案体现一种大气的美。封面右侧添加公司名称，并设计公司标志，使整个页面体现出非对称性美感。

第二，底色及衬底图案采用经过素描感处理的阶梯形状沙漠图案，其中淡化了沙漠的黄色，增加了沙浪的阴影线，使整个基色调更显朴素大方，同时阶梯的形状又蕴含着期望公司节节攀升的美好意愿。

第三，右侧包含公司名称的区域进行了透明渐变色处理，以使公司名称更加突出，同时增强下端公司标志的清晰度，使其不受沙浪图案中阴影线的干扰。公司标志中折纸鹤的图案蕴含两重含义，一则鹤在中国传统审美中蕴含平安、长寿、吉祥之意，与公司所进行的人寿保险业务正相吻合，折纸又是中国传统工艺之一;二则公司是中日合资经营的，而纸鹤又是日本传统的民间工艺吉祥物，它的蕴意与国人的蕴意相似。这样既体现了两国独特、深厚而又富有魅力的传统文化与民族精神，又与公司内涵相符。

第四，衬底的沙浪图案从左上到右下呈对角线的排布是基于美学欣赏中的斜线排布方式进行的，给人以视觉舒适感。上半部分迎着阳光灿烂开放的花儿是“生命如花”的写照，这正与公司名称中的“生命”两字相契合。

第五，在阳光照射下的花儿的投影部分，一则显示花儿正在茁壮成长，同时从美学的角度看使整个画面的上、下两部分有机地联系起来，融为一体，这里，对原来图片中的地面作了透明化处理。

封面和封底的整体色彩以朴素大方为基调，同时也注意到了装饰性色彩的运用。封面和封底整体图案的含意为：保险正如沙漠中的绿洲一样被人类所需要，愿它伴随你一生平安与吉祥，愿公司节节攀升，岁岁成长。

3.封二、封三设计

封二以图片与文字相结合的方式对公司老总及公司特质作了简要介绍，让阅读者对公司有一个直观的良好印象，以增加公司的可信度。封三為总经理寄语，通过此寄语使人对公司充满信心。在封二、封三设计中采用带有纸鹤图案的图片作为衬底，并对其进行了黑白及纹理化处理，以加强纸质的厚重感和坚实感，使其更显美观。

宣传册封面设计的构成与装饰相对具有一定的独立性，但必须从属于宣传册的内容与性质，使设计起到加强和衬托宣传册内容的作用。以更好地契合宣传册的内涵、题材、体裁和风格。可以根据不同公司的性质从多角度、多侧面采用多种方式、多种形式来体现，目的是激发阅读的欲望。

二 公司宣传册目录编排

1.目录编排特点

目录由专栏题目、正文题目、页码等编排而成。其作用是为读者提供刊物内有哪些可读内容的导读，使读者在短时间内找到自己需要的内容。一本刊物的目录编排恰当，不仅可为刊物增色添辉，而且能减少阅览时间。目录编排有竖排、横排两种形式。横排较之古老式的竖排看上去舒服、习惯，是目前常采用的一种编排法。

2.目录编排分析

在设计的公司项目宣传册中，目录中的模块项目以黑体字为佳，子栏目的字体浅一些，均排在栏目的左边，由于是将目录放在封二，为了增加厚重感，加了素色及纹理化处理的图片作为底衬。见图2。

三 公司宣传册版式设计

1.版式设计的基本因素及布局

宣传册的版面主要由正文、标题、图片和空白组成。版式设计首先要考虑版式的条理性、整齐性和完整性。所以版式设计的灵魂，首先在于掌握文章结构的共性和规律性，然后加以条理化。通过构思、构图和着色，以突出宣传册的内容和主题思想。同时易读和沟通也是不可忽视的重要因素。

点、线、面是宣传册版式设计的基本形式因素。版面中的每个文字，均可以视作一个“点”，文字排列成行就成为“线”，按一定规律组合起来的“线”就成为“面”，具有排列有序的纵横节奏。这是组成宣传册版式的基本元素。

版面布局的任务在于组织和安排好版面的整体与局部，局部与局部之间的关系，使版面成为统一的有机整体，要使版面布局结构美，必须做到变化与统一相结合，在变化中贯穿统一，在统一中求变化，以达到一种和谐、秩序、均衡的版式效果。

2.版式设计中的层次结构

每个页面开头的主要文字是大小标题、图片、空白的有机组合，它们对文章的整体布局结构至关重要。它们要放在文章的固定位置，在文章的开头自成体系。在设计的公司宣传册中，将公司的名称用大标题置于首页上方，将公司以人为本的宗旨用图示的方式穿插在公司简介的文字中，以达到既醒目又不凌乱的目的。见图3。

各级标题的颜色、字体、字号，随着正文的各级层次的展开，分别用不同的颜色以示醒目，字体、字号逐次变细、缩小，构成了宣传册版式的又一特色，使各级标题所表示的主题主从关系层次分明，与正文和谐统一。同时各级标题的占行数不同所形成的空白可调节读者的视觉。文字形成字体字号的变化，层次标题的变换，图片的插入，形成韵律感，使版面有疏有密，有张有弛，有静有动，表现出多样的风格和情趣。字行的长短，行距的大小，插图、照片和文字所形成的版面的淡与深，标题的设置、占行和空行，衬页、篇章页的配置以及全刊的布局等，它们之间都具有美学上的比例关系。

在设计公司宣传册中考虑上述因素，注意各级标题主从关系和层次，以及图与文字的排布均衡性，分别用不同颜色、字体、插图和留白平衡。使其内容循序渐进，层次分明。为适应其层次感的需要，将标题按三级排列：一级标题为综艺体，为图加标题;二级标题为黑体加彩;三级标题为黑体。这与文献内文设计相仿。(见图4)。这样可以反映出连续性，产生融合感，使版面在变化中保持整体性。只有恰当运用调和对比，才能使版面主次分明，参差有序，统一完整。

版式设计是对组成文字的部件和各种元素进行集散成锦的艺术处理。从美学角度出发，版面的美学内容可概括为统一与变化、虚与实的互补、韵律与节奏。版式设计具有独到的审美价值，这就是通过立意、构图、造型以及由印刷工艺所提供的可视物质形态的艺术形象。在整个审美过程中，读者通过对刊物版式设计美的欣赏，提高阅读的兴趣，得到美的享受，另一方面美的设计使内容上更加完美，使宣传册的内容美和形式美达到完美的统一。

四 公司宣传册插图与色彩

1.版式设计的插图

文图是构成信息、知识的基本材料，也是版式美学的信息显示。文字形成排列有序的纵横节奏，图的插入，形成韵律感，使版面有疏有密、有张有弛、有静有动，表现出多样的风格和情趣。插图可以起到补充正文、并配合正文表达题意、同时概括地以直观的形象或用具体数据补充正文的不足的作用。

图能替代大量的文字描述，增加容量，配合正文丰富读者的形象思维。图5是在设计公司业务分项及与主项的关系时所设计，它便于阅读者一目了然地理解两者的关系以及分项类型。

每个版面是由标题、正文、图表、页眉等组成的，同时还有分栏、分题的排列，它们之间也存在韵律和节奏的问题。因此要研究插图图面的大小比例以及它们在版面上的排列，要注意图面与文字版面的对比以及它们之间的空间间隔，要设计和运用好各不相同的版面，以调节全刊的空间节律。使图在版面中的明度、面积以及在版面上布局的整体效果达到完美的统一，给读者美的享受。

图6是所设计公司宣传册其中一个页面局部，在文字下方有一段留白，如果编排其他文字项又不够，就设计加一较为疏朗的插图，加了插图后仍有一定空间的留白，以达到文图相谐、疏朗有致、赏心悦目的效果。

2.版式设计的色彩

版面的另一种编排手段是色彩。对于版面来讲，首先吸引人的常是图片，图片之外能把人的视线和注意力争取过去的是大块空白衬托下的标题，空白可说是一种不着色的色彩。

在标题的四周或文图的四周，留有适当的空白，可以形成鲜明的对比，从而使文与图显得分外突出，引人注目。空白太少，则气促而拘，有壅塞之感;空白太多，则气懈而散，显得空旷松散。但有时为了突出重點，使用大面积的空白，迫使视线集中到某一焦点上，以引起视觉的强烈反差。在美学的诸多矛盾中，虚与实历来为艺术大师们所重视。那种把空白看作是版面的一种浪费，认为把版面空间塞得满满的，花边装饰线多才能引起注意的看法是不足取的。版面中的文与图是实，空白是虚，有虚才能衬实。因此空白是版面编排一种不可或缺的色彩。

色彩是一种其他方式所不能比拟的、独一无二的信息传达方式，色彩能够增加传达的信息量，吸引注意力，指挥眼睛，先于形状获取，并且具有比中性色更大的视觉冲击力，提供强调和注意价值，通过色彩可以图解产品，并形成一系列颜色，供人挑选，同时提供观念上的联想和鉴别，创造一种企业或商标形象，增加记忆持久性。大面积的色块、底纹和丰富多彩的版面对比可使刊物更具有活力、更新颖。同时可以用一些白色或灰色调配和局部鲜亮的色彩加以调和，以增加视觉舒适感。从生理上讲，不同年龄、职业、性格的人，喜欢的色彩各不相同。而版式色彩要唤起大多数人的联想和共鸣。所以，要求版式设计者熟知色彩规律，研究人的视觉对各种颜色反应的心理状态。

宣传册也是刊物的一种，它的设计是以审美价值和文化价值为基础的。设计的目的是经由表及里的全面设计，内容本身所具有的传达功能会升华出一种内在的表现力。通过设计的内容所产生的理性结构可以引申出更深层、更广泛的含义来。

参考文献

[1]单春晓、干一青.论杂志设计[J].当代经理人，2005(16)：210～211

[2]叶奕、文伟平.报纸的易读性与版面编排技巧探析[J].湖南医科大学学报，2005(4)：216～218

[3]杨小复.科技期刊封面构图设计及其美学原则[J].编辑学报，2000(3)：133～135

[4]宋岚.责任编辑要关注图书装帧设计[J].出版科学，2004(5)：61～62

[5]车世家、吴贤明.情报刊物的版面编排[J].情报理论与实践，1986(1)：21～23

[6]庞晓宁.谈医学科普丛书的艺术设计[J].中国医学教育技术，2000(2)：124～125

[7]庞富祥.科技期刊的版式美学研究[J].编辑学报，2001(2)：67～69

[8]詹超.杂志设计中的文字设计[J].浙江工艺美术，2007(2)：91～92

[9]许炎镛、张元林、施海.图书与报刊的版式设计[M].北京：人民邮电出版社，1993

[10]曾凯、白献晓、杨春英.科技期刊版式设计的作用[J].中国科技期刊研究，2000(1)：62～63

[11]李亮之.色彩设计与选择[J].无锡轻工业学院学报，1992(4)：355～361

[12]员勃.电子杂志设计中的“动”与“静”[J].广西轻工业，2008(9)：132～133

[13]喻红.影响报纸版面设计的若干要素[J].新闻世界，2010(8)：98～99

[14]王永红.中国传统文化精神与书籍设计[J].美与时代，2003(11)：27～28

[15]生命人寿保险股份有限公司网站.http://www.sino-life.com/

[16]中国平安保险股份有限公司网站.http://www.pingan.com/

[17]中国人寿保险股份有限公司网站.http://www.chinalife.com.cn/

[18]长城人寿保险股份有限公司网站.http://www.greatlife.cn/

[19]太平人寿保险股份有限公司网站.http://www.tplife.com/

〔责任编辑：李锦雯〕

作者：朱佳叶 吉袁媛 朱越雄

第二篇：书籍版式设计研究

摘 要：目前全球进入了多元化信息时代，现代的读者也是多元化的读者。书籍版式设计的目的是通过特定的富有鲜明个性的版面形象来刺激读者，激活、激发读者的阅读欲望。而要完成这个目标的基础是很好的运用排版将信息完善的传达给读者。笔者通过对书籍版式设计的视觉中心、间隔控制、整体联络以及层次等方面总结出版面设计的要点研究，理论结合实践进行科学研究。

关键词：版式设计;视觉中心;间隔;层次

一、书籍版式信息的传达

书籍是知识和文化的载体，书籍能很好地传播所要表达的信息，而书籍版式设计则更能体现整本书的审美格调，好的书籍版式设计能让阅读者有更好的阅读体验与审美感受，能更好的传播书籍所要表达的信息。

在整个书籍版式中会有表现主题及表现形式的需求，版面设计需要在短时间首先抓住阅读者的眼球，吸引其进一步深入观看了解，好的版面设计能依托完美的视觉形式进行传达与表现，可以将好的想法和创意充分展现出来。通过版式、主题、图形、文字、色彩等来传达信息、组织内容及处理空间层次等视觉传达问题都离不开版面设计。版式设计不是单纯的信息拼合，它追求对设计的理解和表现创意的形式感受。书籍版式设计通过独特的视觉形式传达信息，给读者以良好的视觉感受与信息传播。

二、书籍版式设计要点研究

1、视觉中心的主导性

“构图必须有一个中心， 或者讲必须确立画面的宾主关系和‘趣味中心’” [1]。而这个中心也就是画面的视觉中心，视觉中心是指人的视野在一个平面的中心点，这一位置通常是人在观赏作品最先注意到的一个地方。视觉是有选择的，书籍排版中首先也应该把握好视觉中心，确定视觉中心的主导性，将视觉中心部分的内容作为主导。在我国报纸版面学中，以“强势”概念来指称版面元素对读者视觉冲击力，它强调的是通过版面元素的合理配置，让版面的某一区域在数秒内牢牢抓住读者的视线，以引发读者的无意注意[2]。强势是形成视觉中心的必要手段。所以版式设计时要把主体部分强势突出在视觉中心，根据阅读功能、视觉流程以及对美的认识确定好视觉中心主体部分，将主体部分面积大小布局划分好，打造一个好的整体框架，然后再确定其他位置，对视觉中心的主题有一个强势的把控。通过视觉中心进行视觉阅读引导设计，引导读者阅读顺序、流程、主次。(如图1)

图 1

2、间隔控制的必要性

整个版式设计在大的框架以及主题视觉中心部分确定之后，即进行深入设计，深入涉及中间隔则显得尤为重要，间隔是指整个画面中各个部分的距离，包括版面与图块、图块与文字、文字与文字的距离，间隔问题很容易被忽略，但是正是这个细节体现了整个设计的深度与高度。

每行字的行间距和字的大小一样为松间隔，如果行间距大于字体的大小则整体松散，结构不严谨，行间距是字的一半时为紧间隔，紧间隔能制造设计气氛严谨的氛围，紧间隔最紧不能超过字体本身，如果太紧则整个画面太挤太闷，影响视觉效果。

要遵循形式美法则。字体小的部分放在一起，相互關照，形成一个小而不散的整体。文字与文字之间要进行分类分组，分出主体部分和次要部分，组内各小部分之间用紧间隔，组与组之间也有间隔用于区分各个部分。各个部分之间间隔严谨，有主有次，相辅相成。

3、联络整体的全局性

在视觉中心的主导以及间隔控制的严谨下要注意整个画面的联络与呼应，要注意画面的整体性。联络整体可以有多种联络方式，分为指向联络、看齐联络、串联联络，联络之间要注意大小比例关系，如果色块色彩鲜艳则面积相应减少，不可大面积使用鲜艳色彩联络喧宾夺主，同时切记处理平均对待，要有重点有起伏通过对各个部分的联络让整体更加和谐统一，让主体部分更加突出。(如图2)图2通过灰色色块将各个部分进行连接，丰富画面，串联整体。

图2

(1)指向联络

指向联络通过方向性的元素来联络整体与部分的衔接，将各个部分的色彩、文字、图块进行联络，使画面整体和谐统一，指向联络的方式有多种。第一，可以通过小色块的叠加将两个部分进行重叠联络，形状可根据整体画面进行设计选取，如果画面大多为方形形状则选用方形色块进行衔接，如果大多为圆形形状则选用圆形色块，注意面积的比例与整个画面的大小关系，不可喧宾夺主，衔接色块为陪衬作用。第二，可以通过色块渐变进行指向联络，通过将小色块进行色相、明度、纯度的渐变形成一个有指向性的渐变部分，渐变的方向可以暗示读者阅读指向。第三，还可以有小文字组成的指向联络，当文字达到一定数量则可以形成一串文字，文字可以作为直线进行指向性联络，通过文字的内容以及方向具有指向作用。

(2)看齐联络

人的视觉具有联系性，当整个画面中有虚拟的对齐存在时，阅读者默认有对齐的联络，所以联络的方式不一定要重叠在一起，可以通过同一直线上平齐，通过远远看齐可以暗示视觉的平齐。在整个画面中暗藏着很多对应性的对齐，对齐是很重要的一种联络，将整体与局部联络在一起，虚实对比，画面工整统一。

(3)串联联络

并不是所有画面都是横平竖直，也可以有个性的画面展示，但是图形越多越丰富的版式设计更要注意各个部分之间的联络与统一，串联联络则是通过将不同形状、色彩、色块连接起来达到联络整体的效果，串联联络可以拐弯可以有各种形状，将图形有机地结合，相互呼应，相互陪衬。

4、画面层次的丰富性

层次是指系统在结构或功能方面的等级秩序。具有多样性，在版面设计中可按重要性程度划分。不同层次具有不同的性质和特征，既有共同的规律，又各有特殊规律。一个好的版面设计除了抓住视觉中心、间隔控制、联络整体，还要注意层次的区分。良好的层次区分与表达能让画面更丰富，更具感染力，同时主次分明，有节奏有韵律，是一个好的版面设计上升到更高层次的必要条件。画面层次处理可分为装饰性层次、明暗性层次、以及功能性层次。

(1)装饰性层次

装饰性层次是通过装饰性的点线面等丰富画面，装饰细节，强调主题，拉开层次，点线面的运用可以起到画龙点睛的作用.(如图3)

图 3

同时还可通过具象的文字、图形来丰富画面的层次关系，文字可以反映主题内容，文字本身就具有一定的信息量，具象的文字表达既可以有信息的传递又可以丰富画面的层次感。图形比文字的表述更直观，更容易被阅读者关注，文字与图形具象既丰富了内容也丰富了层次，让画面更有韵律层次感。

(2)明暗性层次

明暗可通过深浅、轻重、虚实、边界不清来体现出画面的层次感。在版式设计画面中通过明暗的对比，相互衬托将画面塑造的更丰富层次更多样化。强烈的明暗对比一般用于主体附近，用于突出主题。次要部分则可以通过边界不清打造出一定的层次感，既有虚实的表现力又不会过分突出。

(3)功能性层次

功能性层次即满足基本功能的同时加强画面层次感。功能性是版面设计的最基本要求，好的版面设计功能完善，有良好的视觉引导，主次秩序，内容划分，在将基本功能满足的同时可强化主要功能，拉出主次层次感，比如将主标题充实厚度，从二位到三维的效果，突出其主体位置。同时还可以通过将主体部分不断强化加入细节，衬托出主次，其次可以修复形状、连接整体等不断的丰富画面的层次感。

三、书籍版式设计的不足与展望

随着社会的快速发展，人们的需要也日益增长，书籍版式设计审美不断提高，我们在设计书籍是要注意主题意识增强，通过版面来彰显主题以及品牌，突出个性、品位和理念。同时读者意识增强不断增强，人们生活节奏不断加快，阅读意识的增强在版面上最鲜明的体现是重视版面的易读性，这要求设计者在简短的时间内需抓住阅读者眼球。要增强设计意识，在版面设计过程中，要注意视觉中心的表达，间隔的运用，层次的丰富，同时注重版面的创新。

版式设计是艺术形式与视觉传达形式的设计，同时也是人类文明的载体，在不同的历史发展时期展示着不同的文化演进，表现出独具特色的文化和精神走向。随着时代的进步、工艺水平的提高、物质材料的增多，版式设计的风格也随着时代的变迁不断发展，不断强大。

结语

本文结合韩翔老师《平面媒体设计研究》课程中平面媒体设计研究的相关理论对版式设计进行了初步探究，通过课程与实践相结合探究版式设计的视觉中心、间隔控制、整体联络以及层次等总结出版面设计需要注意的要点，同时希望大力发展原创性趣味性的版面设计，让好的文化更好的传播，本论文在分析和研究版式设计的过程中，还是有遗漏和不足之处，对版式设计的研究，需要研究的还很多。

参考文献：

[1]蒋跃.绘画構图学教程[M].北京：中国美术学院出版社，2003：91.

[2]姜英.当代报纸版面视觉中心的流动轨迹与原因分析——以《华西都市报》为例[J].新闻界，2009(4).

作者简介：

朱姹姣(1996.07—)，女，籍贯：湖南，北京交通大学建筑与艺术学院硕士研究生，研究方向：环境艺术设计。

作者：朱姹姣

第三篇：网页的版式设计技巧探讨

摘 要： 要设计出主题突出、创意新颖、布局合理， 界面简洁美观的网页，版式设计起到了至关重要的作用。文章分析、探讨了版式设计在网页中的应用技巧，按照网页版式设计的要求，先对网页版式的整体布局进行设计，再对网页版式的文字、图片和色彩三大重要元素进行合理规划，尽可能在有限的版面空间中，将多种视觉元素进行整体排列，运用版式设计的美学原理做出更好的网页。

关键词： 网页； 版式设计； 整体布局； 文字； 图片； 色彩

Discussion on the layout design skills of web page

Pan Yan

（Fujian Vocational College of Agriculture， Fuzhou， Fujian 350007， China）

Key words： Web page； layout design； overall layout； text； picture； color

0 引言

在这网络飞速发展的时代，网页作为一种重要新媒体，不断冲击着大众的眼球。如何设计出主题突出、创意新颖、布局合理，界面简洁美观的网页，版式设计很关键。

在现代设计中，版式设计被定义为：在有限的版面空间中，将有限的视听元素进行有规律的排列和组合，它是一种创造性思维活动，是艺术与个人风格的视觉传递手段[1]。版式设计在网页中的应用，是根据主题的需求，利用视觉艺术，将多种视觉元素进行整体排列规划，向浏览者传递重要的资讯。它的视觉语言、视觉因素、设计原则、构成形式等，在网页的整体应用，对深化网页的整体性、构成性、条理性、艺术性、变化性有着至关重要的作用。

1 网页版式设计的要求

网页设计的理念为明确、简约、艺术地传达多种重要的信息。它的要求具体包括以下几方面。

1.1 主题突出

首先要明确主题的需求，这是网页设计的前提。优秀的网页版式设计有吸引人的视觉效果，增进阅读者对内容的理解，在有限的空间和时间里，更全面、快速地展现网站理念、价值标准等，达到最佳的宣传目的。

1.2 体现用户需求，创意新颖

网页设计必须了解用户的需要，明确设计网站的目标，在进行综合分析市场的状况后再制定设计的规划。鲜明的个性，是版式设计的创意灵魂。在网页版式规划过程中既不能过于个性化，大大偏离大众的“口味”，又必需有自己的特色创新。因此，在设计中要多动脑，多调查，多比较，多设计。

1.3 注重其风格

需注重网页的风格和功能，不只是简单追求形式的艺术美。需要契合浏览者的感情来设计网页版式的风格。例如音乐或娱乐类网站，网页就要设计成轻松快乐的风格；对于军事类网站，要设计成严肃庄重的风格；而对于新闻类网站，要设计成简捷明快的风格。

1.4 界面整洁，符合视觉习惯，具有艺术美感

有时为了追求网页的形式美，运用大量的静态和动态的图片、音乐、视频等多媒体元素来修饰页面，为了在网页上增加阅读的信息，甚至在文字排版上运用超出页面的做法。其后果导致网页文件的大小超负荷，大大影响大众浏览网站的速度。优秀的版式设计需要兼顾页面设计和网页技术，将二者综合考虑，既要网页界面简洁，又要兼顾网页的整体性。

由于现代人们习惯于从上到下、从左到右的方式阅读，因此网页中的版式设计应遵循视觉因素原理，包括视觉的移动规律、视觉的错视和视觉生理心理等，以使网页更人性化、更符合浏览者需求。视觉的中心为大众视野冲击力最强的部分，是版式设计的重点，它能让信息传递得更快。网页的版式设计要抓住视觉中心，有重点的设计，做到有条理、有主次。一般放在画面上方或正中间，视觉中心一般都是用强烈的对比色彩，动态的图片或立体效果来抓住大众的眼球。

网页若要设计成具有形式艺术美的界面，则需要溶入版式设计中的美学技巧。美学形式原理有平衡和对称、统一和变化、整合和分割、留白和虚实等，这些应用能提高设计界面的艺术美。

2 网页版式设计的整体布局设计

网页版式设计的整体布局，是要将设计的多要素，对它进行色彩的调整及结构上的编排[1]。首先，在整个版式或组织结构上应用视觉因素原理，抓住界面的视觉中心，将设计的主体与背景进行对比处理，强调网页各页面之间的主从关系。

2.1 网站类型的定位决定网页版面设计的不同要求

网站类型大致分为以下五类[2]。

⑴ 电子商务类网站

该类型是以电商为主的网站，要求有较高的网页稳定和安全性。该类网页在版式界面上要设计成简洁大方，颜色不要多而杂，让网页诚信感增强。

⑵ 企业类网站

该类网页对版式界面上有较高要求，不但需要准确地向浏览者传达网页的信息，而且需增强企业的社会影响，树立企业的形象。

⑶ 政府类网站

该类型是具有庄重严谨的权威网站。它需要在版式设计上树立政府的形象，整个界面清楚明了，以行政特色为主。

⑷ 门户类网站

这种类型的网站信息量大，信息丰富全面。在设计中要求界面具有亲和力，优化页面的结构，让内容上有较强的条理性。

⑸ 形象类网站

如一些广告主页或个人主页。这种类型的网站通过设计出带有较强的艺术美感的界面来使浏览者受到感染，它的规模会比其他类型网站小一些，设计中要体现个性特点。

2.2 版面布局的选择[3]

⑴ “厂”字型局

该布局是目前应用较广的一种。它的特征为将广告语与标志放在页面的最上方，接下来将正文信息放在右边，主菜单放左边。这样设计虽然能让人对页面结构一目了然。可是它要求界面颜色的选择要非常搭配，否则会让浏览者感觉呆板无趣，缺少艺术性。

⑵ “同”字型布局

这种布局方式是国内许多中等以上规模的网站会采用的。这种类型的设计常常会将网站的广告、导航栏及标志放在页面的顶部。将正文信息放在下方，正文的左右两边都设有栏目。将网站的基本信息放置在页面的底部。这样设计虽然充分利用了版面的有限空间来放置较大的信息量，可是页面让浏览者感觉视觉疲惫，缺乏艺术美感。

⑶ “框架”型布局

该类型常为左右型和上下型结构。分为正文信息和导航栏两块。也有三栏结构的，广告图片放在最上边，导航栏放在左边，内容放在右边。

2.3 网页的版面分割

运用表格来划分版面，并细心规划文字图片的背景颜色和版面位置。明确导航设计，既要符合网页浏览的习惯又要将界面设计成简洁美观的视觉效果。具体做法有以几点[4]：

⑴ 通过留白和虚实的美学处理技巧，将各视觉元素的周边留白空间加大。在留白处理上，一般来说大面积留白，可以给人奢华神秘冷清之感，反之面积小的留白，能让人有热闹、欢快、拘束之感。

⑵ 把握好重要及非重要的视觉元素所占比例，使界面主次分明。

⑶ 利用色彩的对比关系来加强色彩对比度。

⑷ 通过美学的重复技巧，界面中反复出现所宣传的物品的信息，强化宣传物品的整体形象。

⑸ 将对比与调和应用于网页中，用调和来规划网页整体，用对比来营造网页的局部美感，处理好对比与调和两者之间的辩证关系，避免单调和重复感。

3 网页版式的各重要元素设计

网页浏览者获得信息的主要视觉元素是文字、图片和色彩。优秀的设计必需要快速、有效、艺术地向浏览者传递信息。所以网页的版式上需要用美学方法来组织和编排各视觉元素，让界面产生无限的视觉美感。

3.1 视觉元素——文字的排版

合理运用文字能让界面的信息有序化、条理化。

3.1.1 网页的标题设计

好的标题设计可以吸引浏览者，识记和理解它。标题设计要简洁明了，体现精髓，体现网页的整体风格。一般在网页的上方放置标题，它可以用大一些的字号，背景可以使用动态或静态的图片。

3.1.2 文字的编排

版面离不开内容，而传达内容的重要方式是文字，文字的编排技巧决定了界面的艺术美观。具体有以下几种技巧。①字体大小和间距需讲究：正文是被浏览最多的文字，一般放在页面的中间部分，字号大小12磅是较适合的。网站域名、标志等重要信息，常被放在页面左上角，它们需要字号大些显示，以便浏览者识记。注册号、声明版权、联系的方式等资讯可以放在页脚，字号可以使用小一些的。文字间的距离包括字间距、行间距及段间距。字间距应要比行间距小，要不然浏览者分不清到底要竖着还是横着浏览。当字体较小时，为了让浏览者更容易看得清，应当相应将字间距加大。当字体较大时，为了让版面紧凑，则应当将字间距减小。设置行间距也会影响网页的阅读性。一般来说，行间距应以接近字体的大小为宜。②字体的选择也有技巧：例如字体强壮有力，造型规整，让人感到简洁清爽，适合于机械、建筑行业、男性用品等主题的网站；字体高雅细致，让人感到柔美和秀丽，更适合饰品、化妆品等女性用品及服务行业的网站。对于少儿类型的网站，设计时要考虑到浏览者的视觉感受，运用趣味、活泼的字体。③要考虑文字运动的速度：对于网页这种新媒体，常常有动态的文字，需规划好文字运动的快慢。为了让浏览者看清识记，文字至少要在网页中停留2秒钟。

3.2 网页版式设计中图形的排版

在界面设计中只应用文字是不适合浏览者长期阅读的，必需要将图片与文字巧妙的搭配。一切以可视的图画形式为信息载体的视觉形象均称为图形，它也是版式设计中重要元素。版式设计中的圆形代表亲切、方形代表整齐、梯形代表时尚、满图代表全面、出血图打破约束，退底图能够让主体形象突出。图形可以超越种族之间的语言、文字差异等因素，视觉冲击力强，在网页中合理运用它，能深化网页条理性，使网页更具号召力和感染力。虽然图形优点这么多，但并不是数量越多越好，如资讯类站点、门户网站访问量较大，图片数量过多则会让浏览速度减慢，故图片数量要求少而精；一些中小型的公司的形象类网站，这类网站设计的主要任务是利用图形宣传企业形象，图形则需要变化多样[5]。

此外，文字与图片的比例也要适当，若图太多，则会影响信息的传递。若字太多，则会让网站的吸引力降低。所以合理的比例应该是字和图各占一半。

3.3 网页版式设计中色彩的运用

好的色彩搭配会增强视觉效果，增加网页的气氛，方便阅读。合理运用版式色彩元素能让网页主题明确，深化网页的条理性，让网页具有瞬间吸引眼球，影响人的心理、生理状态的力量。具体可以有以几种方法。

3.3.1 先确定主体色的配色方法

一个网页常只会用两到三种标准颜色，颜色间需要合理搭配。网页色彩设计需要针对网站的类型，根据主题，充分了解网站的目标定位、规划。要尽可能用安全色调以确保网页的适应性。完成整个页面的配色方案可以先选一种能表现主题的主体色，接下来再根据需要，将主体色近似和对比的颜色挑选出来合理搭配。好的配色页面应该是一个整体的、和谐、赏心悦目的视觉效果。例如在设计宣扬环境保护类网站时，可以使用代表自然和生命的绿色，这样比较容易让浏览者产生信赖和共鸣。

3.3.2 采用特效的配色方法

对于需强调的部分或标题，在色彩上可以做些特效处理，挑选对比强烈的颜色。对于正文信息的色彩在设计时需挑选明度较底的柔和颜色，这样的处理比较适合浏览者长时间阅读。

3.3.3 根据网站类型来选择配色的方法[4]

⑴ 电子商务类网站：为了创造有利于商品交易的色彩心理环境，需要将页面要营造出舒适、温馨、的色彩氛围。

⑵ 公司企业类：为了让品牌和页面设计能高度溶合，也可以配合企业品牌来进行网页色彩设计。

⑶ 社区学校类：设计成能让浏览者自主选择的简洁、明晰、舒适的色彩页面。

⑷ 门户类：为了让浏览者更快速的阅读，页面上尽量选择清静、简洁的色彩。这种色彩选择有利于信息的快速读取。

⑸ 产品类：该网站的页面可以根据产品进行多样化的个性设计，体现独特品牌特性。

⑹ 个人网站、网页、博客、空间、社区：此类页面可以根据浏览者个人喜好和个性追求来选择配色的方案。这种设计方式较灵活，具有鲜明的个性特征。

4 结束语

伴随着时代的脚步，网页作为一种数字新媒体，越来越冲击着人们的眼球。为了吸引大众，如何设计出新颖独特、界面简洁美观，访问便捷的网页，版式设计就显得特别重要了。只有将网页中的文字、图形、色彩等视觉元素运用版式设计的技巧进行合理的编排处理，才能设计出生动有趣、视觉冲击力强的网页设计作品。本文只是重点探讨网页中静态元素的版式设计，在未来将着手对网页中的动态元素，如音频与视频、动画等元素的版式设计进行更好的研究。

参考文献（References）：

[1] 王青.InDesign从入门到精通[M].清华大学出版社出版，

2013.

[2] 戴文忠.版式设计在网页中的应用[J].赤峰学院学报，2011.8.

[3] 董海斌.平面视觉元素在网页设计中的应用研[J].科技信息，

2008.5.

[4] 殷实.以网页设计中的版式设计为例进行视觉审美分析[J].

大舞台，2012.9.

[5] 邓文达.网页界面设计与制作[M].人民邮电出版社，2012.

作者：潘燕