首先要明确两个概念:serif和sans-serif。
- serifSerif在印刷学上指衬线字体。为了理解衬线字体的概念,大家先看几个典型的衬线字体的例子:单词 My 中的字母“M”上下方突出的短横线就是所谓的衬线。同样,y的上方,K的上下,i 和n的下方也都有衬线,所以这些字体都被称为衬线字体。但衬线字体并不一定都有衬线,比如上面例子中的g、“汉”和“字”。事实上,只要满足末端加强原则的字体都是衬线字体。所谓的末端加强,就是使用衬线或粗细变化,使字体笔画的末端得到加强,以改善小号文字的可读性。比如上面例子中的y的下半部分,还有宋体的中文字符,都是采取加粗笔划的末端来达到末端加强的效果。除此之外,很多衬线字体还会采用加强竖向笔划(比如宋体中竖比横粗),夸张字形(最明显的就是小写g这个字符了)等方法进一步改善它的可读性。因为衬线字体的可读性非常好,所以它应用的最多的地方也正是出版物或者印刷品的正文内容等以大段文字作为表现形式的作品上。比较常见的衬线字体有 Georgia、Garamond、Times New Roman、中文的宋体等等。- sans-serif衬线字体以外的一切字体都是无衬线字体。sans- 这个前缀其实是法语,所以比较标准的发音是/san/ 而不是 /sans/。它的意思是“没有”。所以sans-serif就是无衬线字体。无衬线字体比较圆滑,线条一般粗细均匀。比较适合用作艺术字、标题等。因为无衬线字体通常粗细比较均匀,所以在小字体显示的时候,可读性会降低,容易引起视觉疲劳。常见的无衬线字体有Trebuchet MS、Tahoma、Verdana、Arial、Helvetica、中文的幼圆、隶书等等。- 什么时候用serif?什么时候用sans-serif?从上面的介绍中,我们可以知道,衬线字体之所以被设计出来,就是为了用作正文内容的。大家可以随手抄起一张报纸,看看上面的文章是不是宋体。如果手头有外语读物的话,也可以翻来看一下,正文都是衬线字体。同样大小的衬线字体比无衬线字体容易阅读:然后大家可以把报纸翻到头版头条――标题一般都会是各种粗细一致的综艺体或者是中黑体。英文报纸的标题大多也是无衬线的。这个就是应用他们的基本原则。但是大家可以看很多网站――它们的正文内容恰恰是无衬线的Tahoma、Verdana、Arial等等。中文网站可能因为字体的局限性,仍旧使用宋体居多,但查看它们的样式表,就会发现候补字体也大多是无衬线的。这样是不是不好呢? 当然不是。 衬线字体的可读性其实仅仅体现在小字体上。大家可以拿出刚刚抄起来的报纸,和你显示器上的文字比较一下――你会发现,报纸上的文字比显示器上的文字整整小一圈。这个就是print media 和screen media 的最大区别。印刷业为了节约成本,因此会尽可能的在保证可读性的情况下,把文字印小。显示器不存在这样的成本,因此可以显示比较大的文字。在文字足够大的情况下,无衬线字体也是同样可读的。而且因为无衬线字体通常有艺术性,因此在显示器上显示通常比较赏心悦目;而且无衬线字体种类比衬线字体多得多,因此选择余地也很大。所以大家尽可以放心去使用。但是必须保证以下原则:凡是使用无衬线字体的,必须保证其在正文内容中的可读性。否则,使用衬线字体。换而言之,如果你要使用无衬线字体显示网页的正文内容,那么,你必须把它的font-size设的足够大,以保证用户能轻易阅读。至于具体将font-size 设多大,是因字体而异的。
12px对于Verdana 来说已经完全足够,但是要能轻易的阅读隶书,可能需要24px以上才行。对于11px以下的英文字体,推荐使用衬线字体。至于中文,因为显示器的硬件限制,不论是什么字体,都不推荐使用11px以下的font-size来显示。
1、Arial微软公司的网页核心字体之一,是一套随同多套微软应用软件所分发的无衬线体TrueType字型。当字号很小时不容易阅读。Arial Style虽然比例及字重和Helvetica极其相近,但Arial其实是Monotype Grotesque系列的变种。设计Arial时考虑到会在电脑上面使用,在字体及字距上都作了一些细微的调整和变动,以增加它在电脑屏幕上不同分辨率下的可读性。但是,大写的“I”和小写的“l”是无法区别的,你可以考虑用Tahoma字体来替代。Arial的正确英文发音有很多不同说法。虽然有人习惯读作 "air-ree-al" ,但其实应该读作"are-ree-al" 。List Filesystem Directory Information 2、Verdana微软公司的网页核心字体之一,微软公司专门为屏幕显示而开发的。即使字号很小,仍有结构清晰、容易辨识等高品质的表现,所以是显示器中最清晰的字体。我比较喜欢采用10pt的Verdana来做英文正文字体,也推荐大家使用,但字号最好介于10~14像素之间,超出这个范围就不好看了。List Filesystem Directory Information 3、Georgia微软公司的网页核心字体之一,具有在小字下仍能清晰辨识的特性,可读性十分优良(比Times New Roman强)。微软将Georgia列入网页核心字型,是Windows系统的内建字型之一。是网站设计中,浏览效果最好的衬线字体,因为它是专为网上阅读设计的。List Filesystem Directory Information 4、Times New RomanTimes New Roman(泰晤士新罗马),可能是最常见且广为人知的衬线字体之一,在字体设计上属于过渡型衬线体,对后来的字型产生了很深远的影响。另外由于其中规中矩、四平八稳的经典外观,所以常被选为标准字体之一。是网站浏览器默认的字体,12pt以上的字体容易阅读,但小字号的字体易读性差。List Filesystem Directory Information 5、Trebuchet MS微软公司的网页核心字体之一,与Arial相似,但比Arial看起来优雅、古典一点。可以用来做标题,但小字号阅读起来会很困难,低于13pt阅读起来就很累了,不太推荐用来做正文字体)。List Filesystem Directory Information 6、Courier New微软公司的网页核心字体之一,老式打印机字体,有一种独特的机械工整感觉。由于可以轻易的对齐字段的左右边界,因此是程序员写代码时最常用的等宽字体。
12pt的Courier New字体曾是美国国务院的公文标准字体,但于2004年1月停用,改使用14pt的Times New Roman,因为其具“现代性”和“易读性”。List Filesystem Directory Information 7、 Impact微软公司的网页核心字体之一,Impact是1965年发表的一个无衬线字体,字体较为粗犷,其特粗的笔画、紧缩的间距适合使用在标题上,而不常用在正文。List Filesystem Directory Information8、Comic Sans MS微软公司的网页核心字体之一,手写体。这是一种争议很大的字体,说实话,我也不喜欢这个字体,一点美感都没有,不过在一大堆规规矩矩的字体里面,有这么一个随意性比较的字体,可以变换一下口味,也算不错吧,建议不要用在正规的金融、政府、商业机构站点。List Filesystem Directory Information