网页中、英文安全字体选择及设置

天缘博客目前已支持雅黑字体显示，这样在Vista/​​Windows 7​​上会看起来更舒服点，问题虽小不过在测试时还是有些小的细节问题，这里总结一下，网页字体显示要求浏览者必须具有相应的本地字库，才会正常显示，否则将会按照系统默认的字体显示，所以设计网页就不得不考虑用户体验问题，虽然Vista/Windows 7已经发布并流行很久了，而Windows XP依然“东方不败”，占据过半市场，宋体依然是各大中文门户不二选择的主要原因。

一、网页中文字体

主流中文字体包括：微软雅黑、宋体、黑体。相对其它那些琥珀、隶书等，前面提到的中文字体相对较为安全，对中文网站而言，宋体的适应性最强，黑体老二，微软雅黑次之。

其它的新宋体、仿宋和楷体尽量不要用，对很多英文操作系统用户，即时是加装了中文语言包，也至多只有上面提到的六种中文字体（不算Adobe装入字体）。

宋体在VISTA和Windows 7下显示效果的却不太好看，难怪很多VISTA老用户对宋体如此反感，天缘自己用了一段时间Windows 7也比较认可雅黑似乎更好一点（虽然心底更倾向于传统的宋体），感觉主要原因还是跟Windows 7的Clear Type有关（跟分辨率应该没有关系，因为同样分辨率换成XP系统一样会显示很好），对小字号的宋体处理并不好，实际上把字号调上去之后，宋体效果在Vista/Windows 7上一样很好，可惜系统字体又是雅黑，这样一搭配就变成不伦不类的“丑感”了。

天缘博客是个偏向技术类博客，文章本来就长，字体又不能改的太大，再大页面就会更长，所以还是换成微软雅黑了。

二、网页英文字体

主流的英文字体包括：Verdana,Georgia,Courier New,sans-serif,Arial,Times New Roman,Impact

上面六种字体在英文站中算是用的最多的（​​天缘​​简单调查了五六个英文站），也是比较安全的字体，在各浏览器上显示统一性也比较好，此外，还可以使用Lucida Console,Lucida Sans Unicode,Tahoma,Impact,Lucida Grande，Helvetica等安全字体。

下图是​​Dreamweaver CS5​​上推荐的英文字体，仅供参考：

三、中文字体拼音及Unicode对照表

在CSS中使用中文或拼音均可以，如果发现CSS精神错乱，可以使用Unicode编码代替（延伸阅读：​​Unicode百科​​）。下表左侧列字体是按照对应的字体名称设置风格的，部分效果可能看不到应该是因为您的机子上缺少该字体或操作系统不支持。

本表格来源（节选）：​​PRCSS​​

四、网站字体设置方法

这个比较简单，字体可以通过元素的style特性，还可以直接写到CSS文件里，在JS里动态设置也可以（效果相同一般只做特殊用途），例如：

写在元素的style特性里（示例）：

<div style="font-family:Verdana, sans-serif">http://www.metsky.com</div>

写在CSS风格文件里（示例）：

body { margin:0; padding:0; font-family:Arial,"Microsoft YaHei",Simsun; }

注意：上述字体在使用时，如果是中文字体（或英文字体名超过一个单词的字体）时，需使用双引号扩起来，比如：font- family:Arial,"Microsoft YaHei","宋体";

五、字体使用参考建议

1、使用黑体字体的字号建议不要小于18px，否则在1024×768分辨率下，黑体显示会有些“变形”，不太美观，再加粗的情况下会很丑（字号像素知识：​​知识百科：中文字号、磅和像素对照关系​​）。

2、在网页设置可以把雅黑和宋体两种字体全部写上，似乎如果不设置宋体字体，可能在1280×800等宽屏分辨率下，使用Windows XP的用户会对雅黑字体网站显示模糊，天缘实测过调整平滑也没效果，也可能测试的有问题（暂不确定）。

3、IE6及​​IE8​​的兼容模式似乎对类似Arial,"Microsoft YaHei","SimHei"这样的组合标识认识有问题，单独字体设置没有问题。

4、感觉IE这么好的浏览器，被微软越做越难用了，包括IE8，兼容性比起Firefox、​​Chrome​​、Opera等差远了。

5、安全是相对的，不安全是绝对的。