Google Web Font 呈现浏览器的差异

Posted 2023-03-15

【中文标题】Google Web Font 呈现浏览器的差异

【英文标题】：Google Web Font rendering browser differences

【发布时间】：2012-06-13 11:32:02

【问题描述】：

我决定使用 Google Web 字体“Signika”：http://www.google.com/webfonts/specimen/Signika

虽然我非常喜欢这种字体在正确渲染时的外观，但某些浏览器或平台并没有为他们的用户提供这种奢侈。

这是我观察到的：

Arch Linux - 最新 Chromium - 完美 Arch Linux - 最新的 Firefox - 完美 Win7 64 位 - 最新的 Chrome - 差（如果我没记错的话，与右图相同） Win7 64 位（虚拟机虚拟机）- 最新的 Firefox - 差（见下图） Win7 64 位 (virtualbox VM) - IE9 - 完美？？ （见下图）

最后两个让我吃惊。这是左侧IE9和右侧Firefox渲染的比较。两者都在同一台机器上（Win7 64 位 virtualbox VM）。

左边的像素看起来像是被平滑了——像素不是黑色或白色，而是介于两者之间。右边那个好像只用了两种颜色。

当 IE9 的浏览器模式设置为 IE8 或 IE7 时，字体开始看起来像在该机器上的 Firefox 中（不流畅）。

我试图理解这一点。到底发生了什么，有什么办法可以让它看起来很流畅？我四处寻找类似的问题，并尝试了以下建议的修复/解决方法：

font-smooth: always;
-webkit-font-smoothing: antialiased;

和

text-shadow:0 0 1px transparent;

没有效果。 （用最新的 Firefox 在 Win7 64 位（virtualbox VM）上尝试过）

任何建议将不胜感激！

【问题讨论】：

我写了一篇关于这个的详细博客文章。修复：How to fix the ugly font rendering in Google Chrome，这里也有人问过：***.com/q/11487427/1114320

【参考方案1】：

earlier post 中的评论在链接到 this article 的 webfonts 下。它解释说，如果您决定自行托管，则应使用 Postscript 大纲转换为网络字体。

由于您使用的是 Google Webfont，它是开源的。您可以在使用 CSS 调整字体平滑之前尝试此技术。