最常用常见通用字体有哪些


Sans-serif

  1. Helvetica: 被评为设计师最爱的字体，Realist风格，简洁现代的线条，非常受到追捧。在Mac下面被认为是最佳的网页字体，在Windows下由于Hinting的原因显示很糟糕。
  2. Arial: Helvetica的「克隆」，和Helvetica非常像，细节上比如R和G有小小差别。如果字号太小，文字太多，看起来会有些累眼。Win和Mac显示都正常
  3. Lucida Family: Lucida Grande是Mac OS UI的标准字体，属于humanist风格，稍微活泼一点。Mac下的显示要比Win下好。
  4. Verdana: 专门为了屏显而设计的字体，humanist风格，在小字号下仍可以清楚显示，但是字体细节缺失严重，最好别做标题。
  5. Tahoma: 也是humanist风格，字体和Verdana有点像，但是略窄一些，counter略小，曾经是Windows的标准字体，Mac 10.5之后默认也有安装。
  6. Trebuchet MS: 为微软设计的一个humanist风格字体，个人觉得个性太过突出，用得不好会不搭。

Serif

  1. Georgia: 基本上适合正文屏显的衬线字体，非Georgia莫属了。笔画粗重，衬线明线，轮廓较大，小字体显示也很清晰，同时细节还算OK。
  2. Times: Times是为了报纸而设计的，特点是可以在有限的空间塞进去更多的文字，笔画较弱，小字号正文屏显看起来累眼。曾经Engadget改版的时候用了Times作为正文，被骂得很惨之后换成了Georgia。

西文字体只用这几个可用：

  • Windows：Verdana、Tahoma、Arial 以及 Segoe UI（Vista 或更高版本）
  • Verdana 是 Windows 上正文字号显示效果最好的西文字体。在 OS X 里效果也不错。
  • Tahoma 实际上基本是 Verdana 的紧凑版本，很丑。它对网页正文来说太紧了。基本没有什么场合需要舍弃 Verdana 而去用它。
  • Lucida Grande 的特性类似 Verdana，都是在小字号时很不错的字体。
  • Arial 和 Helvetica (Neue) 分别是 Windows 和 OS X 这两个平台上最中庸的西文字体。毫无性格，但也不会添乱，很安全。它们在正文字号时的清晰度稍逊于 Verdana 和 Lucida Grande，但也不错。
  • 如果要兼顾稍大字号时的效果，Verdana 和 Lucida Grande 就不太好了，它们在大字号时很傻。大字号时 Arial 在 OS X 上不如 Helvetica 美观，尤其不如 Helvetica Neue 美观。但这种针对 OS X 的字体优化恐怕一般项目里没有精力做。
  • Segoe UI 和中文搭配起来太小，而微软雅黑的西文部分其实就是基于 Segoe UI 制作的，所以如果要在 Windows 上用 Segoe UI，不如直接用微软雅黑显示西文。Segoe UI 和微软雅黑的西文部分是 Frutiger/Myriad 风格的，应该说总体效果比 Verdana 更美观，但小字号表现并不更好。
  • PT Sans 的风格其实比较特殊，偶尔需要和冬青黑体简体中文混排时可以考虑。
  • 所以 Arial 是最保险的字体。而且这已经是多年的共识了。
  • 如果你真要追求小字号时（比如 12 px）的清晰度，那么 Verdana 可能是最好的跨平台选择。

可以总结出：

  1. 如果页面 charset 是 utf-8, 完美的默认字体方案是：

    1

    font-family: arial, sans-serif;

    无论省略 lang 还是设置为 zh-CN, 在各种环境下都满足预期。

  2. 如果页面 charset 是 gbk, 推荐默认字体方案为：

    1

    font-family: arial;

    Chrome OS 下未测试，根据陈成博客上的反馈，好像会因为没有 sans-serif 而导致中文字体很难看。不过考虑 Chrome OS 还未正式发布，目前可以先忽略。

最后，个人推荐简体中文页面的最佳实践为：

1

2

3

html lang=zh-CN

charset=utf-8

font-family: arial, sans-serif;

Windows 95/98/98SE 宋体、黑体、楷体_GB2312、仿宋_GB2312

Windows XP/2000/2003/ME/NT 宋体/新宋体、黑体、楷体_GB2312、仿宋_GB2312 (Windows XP SP3 宋体-PUA)

Windows Vista/7/2008 宋体/新宋体、黑体、楷体、仿宋、微软雅黑、SimSun-ExtB

例1（小米米官网）：font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;

例2（淘宝技术研发中心）：font: 12px/1.5 Tahoma,Helvetica,Arial,'宋体',sans-serif;

例3（加网 ）：font: 14px/1.5 'Microsoft YaHei',arial,tahoma,\5b8b\4f53,sans-serif;

例4（淘宝UED）：font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;

例5（一淘UX）:font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;

Tahoma：一种十分常见的无衬线字体

Helvetica：一种被广泛使用的的西文字体

Arial：一套随同多套微软应用软件所分发的无衬线体TrueType字型

Sans-serif：sans-serif就是无衬线字体，是一种通用字体族。它在操作系统或者浏览器里是可以设置的，你可以把它设置成宋体，也可以设置成微软雅黑，而设置的这种字体肯定是当前系统里存在的字体，所以使用这个字体就肯定能显示出来，所以在font-family末尾加上sans-serif就能保证调用。

、Window下：

  • 宋体（SimSun）：Win下大部分游览器的默认字体，
    1
    宋体

    在小字号下（如12px、14px）的显示效果还可以接受，但是字号一大就非常糟糕了，所以使用的时候要注意。

  • 微软雅黑（"Microsoft Yahei"）：从 Vista 开始，微软提供了这款新的字体，一款无衬线的黑体类字体，并且拥有 Regular、Bold 两种粗细的字重，显著提高了字体的显示效果。现在这款字体已经成为Windows游览器中最值得使用的中文字体。从Win8开始，微软雅黑又加入了 Light 这款更细的字重，对于喜欢细字体的设计、开发人员又多了一个新的选择。
  • Arial：Win平台上默认的无衬线西文字体（为什么要说英文字体后面会解释），有多种变体，显示效果一般。
  • Tahoma：十分常见的无衬线字体，被采用为Windows 2000、Windows XP、Windows Server 2003及Sega游戏主机Dreamcast等系统的预设字型，显示效果比
    1
    Arial

    要好。

  • Verdana：无衬线字体，优点在于它在小字上仍结构清晰端整、阅读辨识容易。
  • 其他：Windows 下默认字体列表：微软官网、维基百科、Office字体
  • 结论：微软雅黑 为Win平台上最值得选择的中文字体，但非游览器默认，需要设置；西文字体的选择以Arial、Tahoma等无衬线字体为主。