网页中字体的设计与应用

发表于 2009年7月27日由 kily

font-choice

其实字体的设计无论是在网页中还是在平面设计乃至艺术设计中都是非常重要的，不过显然网页上会用到的多一些。最近也看到了很多关于字体的设计文章，今天我就个人学习过程总结一下来和大家交流交流。

1.字体大小<font-size>

网页中字体大小应该是被讨论得最多的因素之一。一般来说门户信息型网站字体大小是14px。字体大小适中，再加上合理的配色浏览者不易产生视觉疲劳。所以采用14px大小字体的网页适合于长时间浏览网页的人。另一方面，还有一些喜欢个性并独立的网页设计者会偏爱12px大小的字体。原因很简单，12px的字体由于笔画几乎都是由1px像素点”打上去”的，所以它看起来比14px以上大小的字体清晰得多。而且还有一点很重要，因为12px是显示器能显示清楚的最小字体大小，所以在网页设计中可以和其它的一些网页元素形成对比。要知道对比在设计中是非常重要的。不过貌似随着”用户体验”的流行许多人也转向了14px的阵营。我要提示大家的一点是：

Robin告诉我们只要你的设计合理，读者会愿意去看那些小字体的！

如何取舍得看你自己了。

2.字体类别<font-family>

一个合理的字体样式设计会给你的设计增彩许多，它会让你的网页看起来更加生动，有趣。这里暂且不说关于字体替换的相关技术，就现实中我们用到的进行说明。

首先你得明白英文字体是没办法显示中文的，这也就是为什么CSS中有font-family这个属性的原因。在你指定首选字体的时候还必须加上备用字体，比如：

font-family: Verdana, Geneva, sans-serif;

这行代码就指定了网页优先采用”Verdana”字体，其次是”Geneva”，依此类推。需要注意的一点是这些字体最好是用”安全字体”，也就是说用一些操作系统中常用的一些字体。

细心的话你可以发现上面的代码并没说明一种中文字体，是不是就显示不了中文了呢。呵呵！不用但心这就是下面要说的了^!^

当你没有指定一种中文字体时网页中的字体会按你浏览器的默认设置进行渲染。而这些默认字体一般会是宋体。因为其它字体在视觉效果上总给人一种不习惯的感觉。不过要是设计合理的话其它的字体也是可以使用的，我在这儿给大家个建议，仅供参考：

中文字体我还是习惯用宋体(虽然现在微软雅黑很流行)，但是英文字体最好不要用宋体，因为它看起来很刺眼，有很多”距齿”。英文字体我比较喜欢”Verdana”。不但清晰看起来给人感觉很舒服。”Geneva”会比较古典，艺术。”Comic Sans MS”会比较有趣等等。你可以运用一些花哨一点的字体比如”Brush Script Std”这一类的Script字体来点缀你的作品。但是切记一定不能用得太多。

所以如何取舍又得看你了，其实设计和生活一样处处得要你做选择。

3.字体样式<font-style,font-weight>

我大概总结了一下比较常用的字体修饰属性就是加粗和斜体。在xhtml里面也可以对应em和strong标记。虽然看起来这两个效果只是装饰做用，其实它们在用户体验和seo方面也用很大的作用。

斜体通常用来修饰被引用的话和一些比较有”意境”的语言。比如：

某某人说过：失败乃成功之母

Only you“`能拌我取西经……

粗体自然不必多说，表示强调。并且能引起视觉上的重视。当你看到上面的斜体引用后你的视觉会转到这一行加粗的字体上。这一点是非常重要的，你不去引导读者的话没有几个人会很细心得看你的作品的。如何使用你说了算^!^

以上也可以总结出我的网页设计观：All depend on yourself…