网页的版式设计（二）
2.文字的整体编排
页面里的正文部分是由许多单个文字经过编排组成的群体，要充分发挥这个群体形状在版面整体布局中的作用。从艺术的角度可以将字体本身看成是一种艺术形式，它在个性和情感方面对人们有着很大影响。在网页设计中，字体的处理与颜色、版式、图形等其他设计元素的处理一样非常关键。从某种意义上来讲，所有的设计元素都可以理解为图形。
（1）文字的图形化
字体具有两方面的作用：一是实现字意与语义的功能，二是美学效应。所谓文字的图形化，即是强调它的美学效应，把记号性的文字作为图形元素来表现，同时又强化了原有的功能。作为网页设计者，既可以按照常规的方式来设置字体，也可以对字体进行艺术化的设计。无论怎样，一切都应围绕如何更出色地实现自己的设计目标。
将文字图形化、意象化，以更富创意的形式表达出深层的设计思想，能够克服网页的单调与平淡，从而打动人心。
（2
3.图像的编排
（1）四角与中轴四点结构
页面的四个角与对角线、中轴四点及水平与垂直的中轴线，具有支配页面结构的作用。
四角是页面边界相交形成的四个点，把四角连接起来的斜线即对角线，交叉点为页面中心。中轴四点指经过页面中心的垂直线和水平线的端点。这四个点可上、下、左、右移动。
通过四角与中轴四点结构的不同组合、变化，可以求得多样的页面结构。在图像排版时紧紧抓住这八个点，可以突出网页的形式美感，网页的版式设计、视觉流程的筹划也得到相应简化。
）文字的叠置
3）标题与正文
在进行标题与正文的编排时，可先考虑将正文作双栏、三栏或四栏的编排，再进行标题的置入。将正文分栏，是为了求取页面的空间与弹性，避免通栏的呆板以及标题插入方式的单一性。标题虽是整段或整篇文章的标题，但不一定千篇一律地置于段首之上。可作居中、横向、竖向或边置等编排处理，甚至可以直接插入字群中，以新颖的版式来打破旧有的规律。
文字与图像之间或文字与文字之间在经过叠置后，能够产生空间感、跳跃感、透明感、杂音感和叙事感，从而成为页面中活跃的、令人注目的元素。虽然叠置手法影响了文字的可读性，但是能造成页面独特的视觉效果。这种不追求易读，而刻意追求“杂音”的表现手法，体现了一种艺术思潮。因而，它不仅大量运用于传统的版式设计，在网页设计中也被广泛采用。
（4）文字编排的四种基本形式
页面里的正文部分是由许多单个文字经过编排组成的群体，要充分发挥这个群体形状在版面整体布局中的作用。
两端均齐 文字从左端到右端的长度均齐，字群形成方方正正的面，显得端正、严谨、美观。
居中排列 在字距相等的情况下，以页面中心为轴线排列，这种编排方式使文字更加突出，产生对称的形式美感。
左对齐或右对齐 左对齐或右对齐使行首或行尾自然形成一条清晰的垂直线，很容易与图形配合。这种编排方式有松有紧，有虚有实，跳动而飘逸，产生节奏与韵律的形式美感。左对齐符合人们阅读时的习惯，显得自然；右对齐因不太符合阅读习惯而较少采用，但显得新颖。
绕图排列 将文字绕图形边缘排列。如果将退底图插入文字中，会令人感到融洽、自然。
（以上内容节选自顾群业等编著的《网页艺术设计》一书，山东美术出版社出版。）
（4）文字编排的四种基本形式
页面里的正文部分是由许多单个文字经过编排组成的群体，要充分发挥这个群体形状在版面整体布局中的作用。
两端均齐 文字从左端到右端的长度均齐，字群形成方方正正的面，显得端正、严谨、美观。
居中排列 在字距相等的情况下，以页面中心为轴线排列，这种编排方式使文字更加突出，产生对称的形式美感。
左对齐或右对齐 左对齐或右对齐使行首或行尾自然形成一条清晰的垂直线，很容易与图形配合。这种编排方式有松有紧，有虚有实，跳动而飘逸，产生节奏与韵律的形式美感。左对齐符合人们阅读时的习惯，显得自然；右对齐因不太符合阅读习惯而较少采用，但显得新颖。
绕图排列 将文字绕图形边缘排列。如果将退底图插入文字中，会令人感到融洽、自然。
（以上内容节选自顾群业等编著的《网页艺术设计》一书，山东美术出版社出版。）
3.文字的强调
（1） 行首的强调
将正文的第一个字或字母放大并作装饰性处理，嵌入段落的开头，这在传统媒体版式设计中称之为“下坠式”。此技巧的发明溯源于欧洲中世纪的文稿抄写员。由于它有吸引视线、装饰和活跃版面的作用，所以被应用于网页的文字编排中。其下坠幅度应跨越一个完整字行的上下幅度。至于放大多少，则依据所处网页环境而定。
（2） 引文的强调
在进行网页文字编排时，常常会碰到提纲挈领性的文字，即引文（也称为眉头）。引文概括一个段落、一个章节或全文大意，因此在编排上应给予特殊的页面位置和空间来强调。引文的编排方式多种多样，如将引文嵌入正文的左右侧、上方、下方或中心位置等，并且可以在字体或字号上与正文相区别而产生变化。
（3）个别文字的强调
如果将个别文字作为页面的诉求重点，则可以通过加粗、加框、加下划线、加指示性符号、倾斜字体等手段有意识地强化文字的视觉效果，使其在页面整体中显得出众而夺目。另外，改变某些文字的颜色，也可以使这部分文字得到强调。这些方法实际上都是运用了对比的法则。
4.文字的颜色
在网页设计中，设计者可以为文字、文字链接、已访问链接和当前活动链接选用各种颜色。例如，如果你使用Frontpage编辑器，默认的设置是这样的：正常字体颜色为黑色，默认的链接颜色为兰色，鼠标点击之后又变为紫红色。使用不同颜色的文字可以使想要强调的部分更加引人注目，但应该注意的是，对于文字的颜色，只可少量运用，如果什么都想强调，其实是什么都没有强调。况且，在一个页面上运用过多的颜色，会影响浏览者阅读页面内容，除非你有特殊的设计目的。
颜色的运用除了能够起到强调整体文字中特殊部分的作用之外，对于整个文案的情感表达也会产生影响。这涉及到色彩的情感象征性问题，限于篇幅，在这里不做深入探讨。
另外需要注意的是文字颜色的对比度，它包括明度上的对比、纯度上的对比以及冷暖的对比。这些不仅对文字的可读性发生作用，更重要的是，你可以通过对颜色的运用实现想要的设计效果、设计情感和设计思想。
（以上内容节选自顾群业等编著的《网页艺术设计》一书，山东美术出版社出版。）
二、图像
除了文本之外，网页上最重要的设计元素莫过于图像了。一方面，图像的应用使网页更加美观、有趣；另一方面，图像本身也是传达信息的重要手段之一。与文字相比，它直观、生动，可以很容易地把那些文字无法表达的信息表达出来，易于浏览者理解和接受。
1.图像的格式
Web通常使用两种图像格式：GIF和JPEG。除此以外，还有两种适合网络传播但没有被广泛应用的图像格式：PNG和MNG。
2.图像的形式
同印刷排版一样，静态图像在网页排版中的运用不外乎四种形式：方形图、退底图、出血图以及这三种形式的结合使用。
（1）方形图 即图形以直线边框来规范和限制，是一种最常见、最简洁、最单纯的形态。方形图使图像内容更突出且将主体形象与环境共融，可以完整地传达主题思想，富有感染性。配置方形图的页面，给人以稳重、可信、严谨、理性、庄重和安静等感觉，但有时也显得平淡、呆板。
（2）退底图 将图像中的背景去掉，只留下主题形象。退底图形自由而突出，更具有个性，因而给人印象深刻。配置退底图的页面，轻松、活泼，动态十足，而且图文结合自然，给人以亲和感。但也容易造成凌乱和不整体的感觉。
（3）出血图 图像的一边或几个边充满页面，有向外扩张和舒展之势。一般用于传达抒情或运动信息的页面，因不受边框限制，感觉上与人更加接近，便于情感与动感的发挥。
（2）块状组合与散点组合结构
块状组合，即通过水平、垂直线分割，将多幅图像在页面上整齐有序地排列成块状，这种结构具有强烈的整体感和秩序美感。各幅图像相互自由叠置或分类叠置而构成的块状组合，具有轻快、活泼的特性，同时也不失整体感。
散点组合，即图像分散排列在页面各个部位，具有自由、轻快的感觉。采用这种结构应注意图像的大小、主次，以及方形图、退底图和出血图的配置，同时还应考虑疏密、均衡、视觉流程等。
4.图像的处理
图像的外形、大小、数量以及与背景的关系，都与内容有着密切的联系。
（1）图像的外形处理
图像的外形能使页面的气氛发生变化，并直接影响浏览者的兴趣。一般而言，方形的稳定、严肃，三角形的锐利，圆形或曲线外形的柔软亲切，退底图及一些不规则或不带边框的图像活泼。
（2）图像的面积
图像在网页中占据的面积大小能直接显示其重要程度。一般地，大图像容易形成视觉焦点，感染力强，传达的情感较为强烈；小图像常用来穿插在字群中，显得简洁而精致，有点缀和呼应页面主题的作用。在一个页面中，如果只有大图像而无小图像或细密的文字，就会显得空洞，但只有小图像而无大图像又使页面缺乏视觉冲击力。
图像的大小不仅决定着主从关系，也控制着页面的均衡与运动。大小对比强烈，给人跳跃感，使主角更突出；大小对比减弱，则页面稳定、安静。这是因为，访问者在浏览页面时，首先会注意到大图像，然后再看到较小的图像，这种由大到小的引导，使浏览者的视线在页面上流动，便造成一种动势，使页面活泼起来。
因此，在网页设计时，应首先确定主要形象与次要形象，扩大主要图像的面积，使次要角色缩小到从属地位。只有大小图像主次得当地穿插组合，才能构成最佳的页面视觉效果。
（3）图像的数量
图像的数量是根据内容决定的。只用一幅图像，会使内容突出、页面安定。增加一幅图像，页面会因为有了对比和呼应而活跃起来。再增加一幅，则更加热闹、活泼。但是，限于目前网络的传输速度，使用图像时一定要谨慎，大的图像会降低页面显示速度，即使是小图像，如果运用数量过多，同样会使页面下载速度变慢。随着网络环境及技术条件的改善，这种情况已经有了很大的改观。
（4）与背景的关系
网页图像与背景是对比和统一的关系。也就是说，图像与背景在和谐统一的基础上，应存在一定的对比，以使主要图像更加突出。如精密的相机镜头以粗糙的岩石为背景，明亮的文字以深邃的星空为背景，或者使用没有背景及陪衬物的退底图像，周围留出大面积空白，都是利用对比对主体形象起到突出作用。
5.图像在长页面中的应用
网页一般都是纵向的(也有特意设计成横向滚屏的)，其长度从一屏到三屏不等，有时甚至更多。访问者在浏览页面时，通过拖动垂直滚动条使网页一屏一屏地显示，但这并不意味着我们可以将整个页面分割开来，孤立地进行每一屏的设计。页面的整体感是建立在形象的启承关系上，尽管页面被分割成几屏来显示，但图像或文字的延续性应使浏览者得到完整、统一的视觉感受。设计者所要做的就是进行通盘考虑，例如：寻找对比中的和谐、建立同一的视觉识别等，来处理好每一屏与整个页面的关系。
三、版式的基本类型
网页版式的基本类型主要有骨骼型、满版型、分割型、中轴型、曲线型、倾斜型、对称型、焦点型、三角型、自由型十种。
1.骨骼型
网页版式的骨骼型是一种规范的、理性的分割方法，类似于报刊的版式。常见的骨骼有竖向通栏、双栏、三栏、四栏和横向的通栏、双栏、三栏和四栏等。一般以竖向分栏为多。这种版式给人以和谐、理性的美。几种分栏方式结合使用，既理性、条理，又活泼而富有弹性。
2.满版型
页面以图像充满整版。主要以图像为诉求点，也可将部分文字压置于图像之上。视觉传达效果直观而强烈。满版型给人以舒展、大方的感觉。随着宽带的普及，这种版式在网页设计中的运用越来越多。
3.分割型
把整个页面分成上下或左右两部分，分别安排图片和文案。两个部分形成对比：有图片的部分感性而具活力，文案部分则理性而平静。可以调整图片和文案所占的面积，来调节对比的强弱。例如：如果图片所占比例过大，文案使用的字体过于纤细，字距、行距、段落的安排又很疏落，则造成视觉心理的不平衡，显得生硬。倘若通过文字或图片将分割线虚化处理，就会产生自然和谐的效果。
4.中轴型
沿浏览器窗口的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面给人稳定、平静、含蓄的感觉。垂直排列的页面给人以舒畅的感觉
