网页设计_02_网页版式设计.ppt

《网页设计_02_网页版式设计.ppt》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、西南交通大学网页设计杨柳1文字的格式化字号、字体、行距文字的整体编排文字的强调文字的颜色图像图像的格式图像的形式图像的编排图像的处理图像在长页面中的应用版式的基本类型第二章网页版式设计22.1文字的格式化字号、字体、行距字号大小可以用不同的方式来计算，例如磅（point）或像素（pixel）。因为以计算机的像素技术为基础的单位需要在打印时转换为磅，所以，建议采用磅为单位。　　最适合于网页正文显示的字体大小为12磅左右，现在很多的综合性站点，由于在一个页面中需要安排的内容较多，通常采用9磅的字号。较大的字体可用于标题或其他需要强调的地方，小一些的字体可以用于页脚和

2、辅助信息。需要注意的是，小字号容易产生整体感和精致感，但可读性较差。　　网页设计者可以用字体来更充分地体现设计中要表达的情感。字体选择是一种感性、直观的行为。但是，无论选择什么字体，都要依据网页的总体设想和浏览者的需要。32.1文字的格式化字号、字体、行距粗体字强壮有力，有男性特点，适合机械、建筑业等内容；细体字高雅细致，有女性特点，更适合服装、化妆品、食品等行业的内容。在同一页面中，字体种类少，版面雅致，有稳定感；字体种类多，则版面活跃，丰富多采。关键是如何根据页面内容来掌握这个比例关系。　　从加强平台无关性的角度来考虑，正文内容最好采用缺省字体。因为浏览

3、器是用本地机器上的字库显示页面内容的。作为网页设计者必须考虑到大多数浏览者的机器里只装有三种字体类型及一些相应的特定字体。而你指定的字体在浏览者的机器里并不一定能够找到，这给网页设计带来很大的局限。解决问题的办法是：在确有必要使用特殊字体的地方，可以将文字制成图像，然后插入页面中。42.1文字的格式化字号、字体、行距行距的变化也会对文本的可读性产生很大影响。一般情况下，接近字体尺寸的行距设置比较适合正文。行距的常规比例为10:12，即用字10点，则行距12点。这主要是出于以下考虑：适当的行距会形成一条明显的水平空白带，以引导浏览者的目光，而行距过宽会使一行文字失去较

4、好的延续性。　　除了对于可读性的影响，行距本身也是具有很强表现力的设计语言，为了加强版式的装饰效果，可以有意识地加宽或缩窄行距，体现独特的审美意趣。例如，加宽行距可以体现轻松、舒展的情绪，应用于娱乐性、抒情性的内容恰如其分。另外，通过精心安排，使宽、窄行距并存，可增强版面的空间层次与弹性，表现出独到的匠心。　　行距可以用行高（line-height）属性来设置，建议以磅或默认行高的百分数为单位。例如：｛line-height：20pt｝、｛line-height：150%｝。52.1文字的格式化图1：通过文字大小疏密进行处理，突出重点，层次分明。62.1文字

5、的格式化图2：上、中部文字编排疏散，传达出轻松愉快的感觉。下部的文字编排采用较小的行距，与上面的编排方式形成对比，丰富了版面空间层次。72.1文字的格式化文字的整体编排页面里的正文部分是由许多单个文字经过编排组成的群体，要充分发挥这个群体形状在版面整体布局中的作用。从艺术的角度可以将字体本身看成是一种艺术形式，它在个性和情感方面对人们有着很大影响。在网页设计中，字体的处理与颜色、版式、图形等其他设计元素的处理一样非常关键。从某种意义上来讲，所有的设计元素都可以理解为图形。82.1文字的格式化文字的整体编排（1）文字的图形化　　字体具有两方面的作用：一是实现字意与语

6、义的功能，二是美学效应。所谓文字的图形化，即是强调它的美学效应，把记号性的文字作为图形元素来表现，同时又强化了原有的功能。作为网页设计者，既可以按照常规的方式来设置字体，也可以对字体进行艺术化的设计。无论怎样，一切都应围绕如何更出色地实现自己的设计目标。　　将文字图形化、意象化，以更富创意的形式表达出深层的设计思想，能够克服网页的单调与平淡，从而打动人心。92.1文字的格式化图3：将文字放大，不仅实现了字意与语义的功能，而且具备了视觉冲击力。102.1文字的格式化文字的整体编排（2）文字的叠置文字与图像之间或文字与文字之间在经过叠置后，能够产生空间感、跳跃感、透

7、明感、杂音感和叙事感，从而成为页面中活跃的、令人注目的元素。虽然叠置手法影响了文字的可读性，但是能造成页面独特的视觉效果。这种不追求易读，而刻意追求“杂音”的表现手法，体现了一种艺术思潮。因而，它不仅大量运用于传统的版式设计，在网页设计中也被广泛采用。112.1文字的格式化图4：由字符(ASCII码)组成的网站标志。122.1文字的格式化文字的整体编排（3）标题与正文在进行标题与正文的编排时，可先考虑将正文作双栏、三栏或四栏的编排，再进行标题的置入。将正文分栏，是为了求取页面的空间与弹性，避免通栏的呆板以及标题插入方式的单一性。标题虽是整段或整篇文章的标题，但不