4.1网页字体与字体编排

1.标志
　　文字型标志是以含有象征意义的文字造型作基点，对其作变形或抽象改造，使之图案化。
　　使用文字作为网站标志，可以使用中文或外文与数字组合来表现，意义简单明确。
 
2.标题
　　除了文章的标题采用文字形式外，一些信息的栏目、网络广告的标题等也是通过文字形式体现。
　　标题不一定是一个完整的句子，可以使用短语或口号。
　　文字标题要尽量简洁明了、引人注目、吸引浏览者。
　　标题应安排在醒目的位置，使用较大的字体，在版面中作点或线的安排。
　　为了保证标题的显示效果，大部分设计者都将其设置为图形格式。

3.超链接
　　文字链接可应用于网页中导航栏链接、侧焦点链接栏的链接、中部分类信息主题链接以及文章中关键词链接。

4.信息
　　文字信息是标题的详细内容。
　　在进行网页设计时，文字信息虽然简单，但是内容一定要适合标题，同时对文字的字体、字型、大小、颜色和编排都要经过精心的设置，以达到更好的浏览效果。

4.1.2字体的使用
　　字体的最大特点就是每种字体给人带来不同的情感和风格感受。
　　字体有两方面的作用：一是实现字意与语义的功能；二是美学效应。
从加强平台无关性的角度来考虑，正文内容最好采用默认字体，因为浏览器时用本地机器上的字库显示页面内容。

1.中文字体
　　最常用的基本字体主要有：规范字体和拉丁字母。
1）规范字体
　　宋体字形结构方中有圆，刚柔并济，既典雅庄重又不失韵味灵气，从视觉角度来说，宋体阅读最省目力，不易造成视觉疲劳，具有很好的易读性和识别性。
标题使用宋体给人稳健、传统的印象，宋体由书法体发展而来，最便于阅读。

　　粗宋体饱满而具有稳定感，变细的话就会十分优美。
　　字母表文体中相当于宋体的字体叫做罗马体。

　　楷体字型柔和悦目，字型结构舒张有度，可读性和识别性均较好，适用于较长的文本段落，可用于标题。

　　仿宋体笔画粗细均匀，秀丽挺拔，有轻快、易读的特点，适用于文本段落。因其字型娟秀，力度感差，故不宜作标题。

　　黑体的横竖线条粗细相同，结构非常合理。
　　黑体不仅庄重醒目，而且极富现代感，因其形体粗壮，在较小字体级数时宜采用等线体（即细黑），否则不易识别。
　　标题使用黑体给人以合理、理智的印象。
　　另一方面，黑体的横竖线条一样粗，合理而没有浪费空间，传递了理智的印象。
　　

　　将线的开头和结尾变圆，就成为黑圆体，可以缓和冷漠、坚硬的感觉，传递温柔的印象。
　　圆体视觉冲击力不如黑体，但在视觉心理上给人以明亮清新、轻松愉快的感觉，其识别性弱，只适宜标题文字。

2）手写体（书法体）
　　手写体分为两种，一种来源于传统书法，比如隶书体、行书体，另一种是以现代风格创造的自由手写体，比如广告体POP体。

　　手写体只适用于标题和广告性文学， 长篇文体段落和小字体级数时不适宜使用，应尽量避免在同一页面中使用两种不同的手写体。
　　因为手写体形态特征鲜明显著，很难形成统一风格。不同手写体易造成界面杂乱的视觉形象。
　　另外，将手写体和黑体宋体等规范的字体相配合，则会产生动静相宜、相得益彰的效果。

3）美术体（装饰字体）
　　美术体时在宋体、黑体等规范字体基础上变化而成的各种字体，比如综艺体、琥珀体。
　　美术体具有鲜明的风格特征，不适于文本段落，也不宜混杂使用，多用于字体级数较大的标题，发挥引人注目、活跃界面气氛的作用。国内电脑字体根据字库文件不同稍有区别，例如常用的方正字库、文鼎字库、华康字库等。

2.拉丁字母
　　依据其基本结构可以分为：饰线体、无饰线体和装饰体。
1）饰线体
　　此类字体在笔画末端带有装饰性部分，笔画精细对比明显，与中文的宋体具有近似形态特征，饰线体在阅读时具有较好的易读性，适于用作长篇幅文本段落，代表字体是新罗马体（Times New Roman）。

2）无饰线体
　　笔画的粗细对比不明显，笔画末端没有装饰性部分。字体形态与中文的黑体相似。由于其笔画粗细均匀，故在远距离易于辨认，具有很好的识别性，多用于标题和指示性文字。
无饰线体具有简洁规整的形态特征，符合现代的审美标准，代表字体是赫尔维梯卡体（Helvetica）。

3）装饰体
　　即通常所谓的花体，阅读较为费力，易读性较差，只适合于标题或较短文体。类似于中文的美术体和书写体，代表字体是草体。
在某些特殊场合，例如广告或展示性的短语中，拉丁字母全部使用小写字母，能够造成一种平易近人的亲切感。
 
　　拉丁字母字体大都包含字幅（正、长、扁），黑度（细、粗、超粗），直斜的变化，因此而由一种基本字型可以变化出各种具有相似特征的同族字体，这种字体统称为字族。

　　无论选择什么字体，都要依据网页的总体设想和浏览者的需要。
　　在网页文字设计中，选择2-3种字体的视觉效果较好，这样会显得整齐而不觉得凌乱。
　　具体应用时可以拉长、压扁、倾斜、加粗、变细，这样能产生丰富多彩的视觉效果。
　　同一页面中的字体应尽量在同一字族中选用，以保证界面具有明确、统一的风格。

4.1.3文字的大小
　　放大标题会给人有力、活跃、自信的印象。
　　缩小则表现出纤细和慎密的印象。

　　标题文字的大小与正文之比叫做跳动率，跳动率越大画面越活跃。
　　一般情况下，网页正文可以使用12-16像素大小的文字。

　　将标题的文字变大，粗细效果会加倍。
　　大而粗的文字最有精神，大而细的文字能使印象最强。

　　将文字变小，粗细效果会减弱。
　　细而小文字美，细而大效果更明显。

　　字体选择是一种感性、直观的行为。
　　粗体字强壮有力，有男性特点，适合机械、建筑业等内容；细体字高雅细致有女性特点，更适合服装、化妆品、食品等行业的内容。

4.1.4字体的粗细
1.字体粗细特征
　　字体细显得优美，字体粗则显得有力。

2.粗字宜用作标题
　　粗字给人有精神、有力量的印象，最适合于强调戏剧性信息与富有活力感的网页。

3.正文不宜粗细变化
　　粗细效果对于正文中的小字是一样的，但故意运用粗细变化，就会造成可读性的降低，调整字体粗细要把握好度。

4.1.5字距与行距
　　运用字距与行距的宽窄同时作综合变化，这样能够给作品版式增加空间层次和弹性。
　　行距的变化也会对文本的可读性产生很大的影响，一般情况下，接近字体尺寸的行距设置比较适合正文。

　　行距的常规比例为10：12，即用字10点行距12点。
　　适当的行距会形成一条明显的水平空白条，以吸引浏览者的目光，而行距过宽则会使则一行文字失去较好的延读性。
　　行距一般不超过字高的200%。

4.1.6特殊字体
1.特殊字体应用

　　为了避免你所选择的字体在访问者的计算机上不能显示。有两种解决方法：层叠样式表CSS有助于解决这些问题，而通常的方法时在的确有必要使用特殊字体的地方，将文字设计成图像，然后插入页面中。

2.文字图形化
　　为了实现文字的字体效果，将文字笔画做合理的变形搭配使之产生类似有机或无机图形的趣味，强调字体本身的结构美和笔画美，把记号性的文字作为图形元素来表现，同时又强化了原有的功能克服网页的单调和平淡从而打动人心。

3.文字与图形的叠置
　　在图形上叠加文字，空间感，跳跃感，透明，杂音，叙事感。

4.2文字编排的基本形式
1.两端对齐
　　整齐美观，注意避免平淡，可选取不同形式的字体穿插使用。

2.一端对齐
　　左对齐符合人们的阅读习惯。

3.居中排列
　　令视线集中，中心突出，但阅读起来不太方便，适合文字不多的。

4.文字绕图排列
　　给人亲切自然生动，融合感、亲切力强。

5.自由编排
　　使版式更加活泼、新颖，具有较强烈的动感，但要注意保持版面的完整性，还有注重有一定的编排规律。
　　倾斜的文字适合版面活动感的特点，突出视觉焦点。

6.标题与正文的编排
　　标题完全可以打破一般视觉的常规导向，可横排、竖排、居中或边置等排列。

4.2.2文字的强调
如果什么都想强调，其实是什么都没有强调。
1.强调字首
2.引文的强调
3.关键词的强调
4.链接文字的强调
　　如果要改变链接文字颜色，则不要使用和背景相似的色相、相似的饱和度以及相似亮度的颜色作为链接的颜色
5.线框、符号的强调

4.3网页文字设计方法

4.3.1网页文字设计技艺
1.提高可读性
　　1）让你想表达的内容清晰醒目，让浏览者开始就明白你的意思
　　2）避免使用不清晰的字体，否则容易使阅览者产生反感
　　3）恰当地选择你所需要的字体，适当采用虚实对比、大小对比
　　4）注意文字编排方向，注意安排阅览者的视线，适当运用直线与曲线编排
　　5）根据视觉流程的原理，通常把重点信息放在右侧

2.精于位置
　　1）注意文字的对齐，适当安排字间距、行距
　　2）注意图文交错，既不要影响图形的观看，也不能影响文字的阅览
　　3）文字不要顶天立地，也不支持边角，即做到上留天，下留地。

3.营造视觉美感
　　字体设计良好，组合巧妙的文字能使人感到愉快，留下美好的印象，从而获得良好的心理反应。

4.富于创造性

4.3.2网页文字创意设计方法
　　1.对比
　　2.笔画互用
　　3.笔画减省
　　4.笔画突变
　　5.添加形象
　　6.笔画连接
　　7.会意及象形
　　8.表面装饰
　　9.白线中分
　　10.让点变化
　　11.让0圈变化
　　12.添加圆框或方框