PHP笔记网

用了一下CentOS下的Firefox浏览器，发现同一个页面样式跟Window下的不一样，Window下字体表现更好看些，用firebug分析，页面css如下：

html, body {
    color: #000000;
    font: 12px/20px arial,helvetica,verdana,tahoma,sans-serif,'宋体';
    word-break: break-all;
    word-wrap: break-word;
}

发现，Window下起作用的是 helvetica字体，而CentOS下起作用的是 arial字体，也就是说 helvetica字体 渲染更好看些。

简介：Helvetica字体的50年

Arial, Helvetica 还是 Helvetica, Arial？

几乎所有人都认为 Helvetica 比 Arial 这个「可耻」的模仿者要好看， 可惜 Windows 并没有默认安装 Helvetica，只有少部分网页设计师或字体爱好者才会自己去安装它。但不得不承认，Helvetica 在 Windows 下的渲染实在是糟透了。Helvetica 是 Mac 下默认使用的正文字体，但 Mac 也安装了 Arial，且两者的渲染都正常。一些 GNU/Linux 发行版则使用 Liberation Sans 来作为 Arial 的代替，因此在 Linux 用户中 Liberation Sans 和 DejaVu 等字体使用得相对广泛，当然 Arial 和 Helvetica 作为常用字体，部分用户也会自己去安装。

现在很多网页的 CSS 里是这样设定字体的：「font-family: Arial, Helvetica, sans-serif;」，有些人则提出了异议，认为应该把 Helvetica 放在 Arial 的前面。这两种做法不见得哪种更好，都有利有弊吧。

假 如是 Arial 在前的话，也就是「font-family: Arial, Helvetica, sans-serif;」。Windows 下显示的当然是Arial； Mac 虽然默认的字体是 Helvetica,  但因为这个设定浏览器选择的还是 Arial；Linux 情况则比较复杂。有些人觉得这种设定有些繁琐，不如把 Helvetica 删掉，直接写「font-family: Arial, sans-serif;」。这种说法不无道理，但如果考虑到有部分 Linux 用户安装了 Helvetica 却没有安装 Arial，为了更好的显示效果，这样的设定还是有必要的，反正多加 10 个字符也无大碍。

假如是 Helvetica 在前的话，也就是「font-family: Helvetica, Arial, sans-serif;」。Mac 用户看到的肯定是优雅的 Helvetica；大部分 Windows 用户看到的是 Arial，如果你不幸安装了 Helvetica 却会看到一团糟；Linux 的情况还是很复杂，在此不考虑了。

对于中文网页，保守采用 Arial 在前的设计也不错，毕竟 Arial 和 Helvetica 的区别本来就不大。纯英文网页的设计，就看个人品味和网站访客的需求了。考虑到在 Windows 下安装 Helvetica 的用户毕竟很少，个人还是倾向于使用 Helvetica 在前的设计，这样能给 Mac 用户带来更好的体验。

Helvetica 还有一种改进版，叫 Helvetica Neue，Neue 在德语中就是「新」的意思，也就是英文的 New，但不能直接读作 New，正确读音类似于 ['nɔyə] 。相对于 Helvetica，Neue Helvetica 在结构上的高度和宽度更为统一，可读性有所增强，加重了标点符号的设计，并增加了数字间的间距。所以为了更完美的效果，CSS 里可以这样写：「font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;」。