网页的版式设计

solidvacuum

网页的版式设计（一）, f; {% j/ z( s  `1 M! J
编者按：很多从事网页设计的计算机专业人员，对于网页的制作技术驾轻就熟，但对于网页富有艺术性和个性的设计却感到力不从心。特别是没有经过艺术设计专业训练的网页制作者，在掌握了网页制作技术的情况下，都渴望将自己的网页制作得更具创意和美感。目前关于网页制作的讨论和介绍，多以讲解软件的技术性操作为主要内容，侧重艺术方面的非常之少。经过作者同意，从这一期开始，我们选载《网页艺术设计》一书的部分章节，从最基本的内容讲起，希望对广大网页制作者有所助益。
5 @+ l0 n1 L6 N$ x3 [; q: k; a" i+ b9 I& p
一、文字的格式化
4 f2 `  y! Q2 a" Q# c' w
% g# M) u( M  v& b1 ?1.字号、字体、行距
/ {8 c) j; J% p9 }' v% p- {　 字号大小可以用不同的方式来计算，例如磅（point）或像素（pixel）。因为以计算机的像素技术为基础的单位需要在打印时转换为磅，所以，建议采用磅为单位。
: b8 k4 F& x: f6 T
( {1 G& c, h( D9 j1 b# D　　最适合于网页正文显示的字体大小为12磅左右，现在很多的综合性站点，由于在一个页面中需要安排的内容较多，通常采用9磅的字号。较大的字体可用于标题或其他需要强调的地方，小一些的字体可以用于页脚和辅助信息。需要注意的是，小字号容易产生整体感和精致感，但可读性较差。 & ~& S) }2 {' ^+ r
, y6 [5 T: |8 @* G* U; @- i3 m( ~6 E
　　网页设计者可以用字体来更充分地体现设计中要表达的情感。字体选择是一种感性、直观的行为。但是，无论选择什么字体，都要依据网页的总体设想和浏览者的需要。 & n7 L" F- D' \0 Z# X' C
9 V/ \& e+ `; e8 R0 ~
　　粗体字强壮有力，有男性特点，适合机械、建筑业等内容；细体字高雅细致，有女性特点，更适合服装、化妆品、食品等行业的内容。在同一页面中，字体种类少，版面雅致，有稳定感；字体种类多，则版面活跃，丰富多采。关键是如何根据页面内容来掌握这个比例关系。
1 S% U; h+ X8 Z" G9 j! L* Q+ e/ c% o% }0 B9 h! o6 V- I
　　从加强平台无关性的角度来考虑，正文内容最好采用缺省字体。因为浏览器是用本地机器上的字库显示页面内容的。作为网页设计者必须考虑到大多数浏览者的机器里只装有三种字体类型及一些相应的特定字体。而你指定的字体在浏览者的机器里并不一定能够找到，这给网页设计带来很大的局限。解决问题的办法是：在确有必要使用特殊字体的地方，可以将文字制成图像，然后插入页面中。 . \; g8 G5 J2 e7 @0 K

9 O$ x: ]+ L1 O: \0 S　　行距的变化也会对文本的可读性产生很大影响。一般情况下，接近字体尺寸的行距设置比较适合正文。行距的常规比例为10:12，即用字10点，则行距12点。这主要是出于以下考虑：适当的行距会形成一条明显的水平空白带，以引导浏览者的目光，而行距过宽会使一行文字失去较好的延续性。 & D4 e( o0 M* P% Q% Y# c4 l
; B& n# ]  r* [) e6 X. V7 w
　　除了对于可读性的影响，行距本身也是具有很强表现力的设计语言，为了加强版式的装饰效果，可以有意识地加宽或缩窄行距，体现独特的审美意趣。例如，加宽行距可以体现轻松、舒展的情绪，应用于娱乐性、抒情性的内容恰如其分。另外，通过精心安排，使宽、窄行距并存，可增强版面的空间层次与弹性，表现出独到的匠心。
+ n: Y$ N% h+ B( w3 b
& t4 {- y1 i4 [2 Q. {  e- `: Z　　行距可以用行高（line-height）属性来设置，建议以磅或默认行高的百分数为单位。例如：｛line-height：20pt｝、｛line-height：150%｝。
4 q' P  T6 L/ _: d3 v' U  U6 X. T! ^4 k
[/td][/tr][/table]