谷歌网页字体在Chrome上显示不佳。

Question

我在我的网站上大量使用Google Webfonts，但不幸的是，谷歌浏览器显示它们的效果很差。我已将字体抗锯齿设置为“always”，但似乎没有起到作用。

举例来说：

在Google Chrome浏览器中，Londrina Outline字体的效果如下图所示：(插入图片链接)

而在Firefox浏览器中，Londrina Outline字体的效果如下图所示：(插入图片链接)

同样地，在Google Chrome浏览器中，Walter Turncoat字体的效果如下图所示：(插入图片链接)

而在Firefox浏览器中，Walter Turncoat字体的效果如下图所示：(插入图片链接)

请问有任何方法可以使它们更加平滑 / 更好看吗？

谢谢。

- user1310420

---

@abraham 我认为原帖作者想知道是否有任何方法可以使字体看起来更加平滑。 - Connor

@Connor 这可能是一个合乎逻辑的猜测，但有些人可能会花费一小时的时间来研究答案，最终发现他们回答了错误的问题。 - abraham

看看http://superuser.com/questions/308135/how-can-i-improve-font-appearance-in-google-chrome 这似乎是同样的问题，有更多的进展。 - Iain Ballard

我写了一篇详细的博客文章，包括修复方法：如何修复Google Chrome中丑陋的字体渲染问题。 - Sliq

Answer 1

字体渲染问题在GChrome中很常见，尝试改变@font-face资源的顺序... Chrome利用@font-face源中的.svg文件，在某些情况下，它不能容忍.svg被调用为列表中的最后一项。

@font-face {
font-family: 'my-dirty-font';
src: url('../fonts/my-dirty-font.eot');
src: url('../fonts/my-dirty-font.eot?#iefix') format('eot'),
url('../fonts/my-dirty-font.woff') format('woff'),
url('../fonts/my-dirty-font.ttf') format('truetype'),
url('../fonts/my-dirty-font.svg') format('svg');
font-weight: normal;
font-style: normal;
}

如果@font-face命令看起来相似，尝试进行更改。

@font-face {
    font-family: 'my-dirty-font';
    src: url('../fonts/my-dirty-font.eot');
    src: url('../fonts/my-dirty-font.eot?#iefix') format('eot'),
    url('../fonts/my-dirty-font.svg') format('svg');
    url('../fonts/my-dirty-font.woff') format('woff'),
    url('../fonts/my-dirty-font.ttf') format('truetype'),
    font-weight: normal;
    font-style: normal;
    }

- Meigo62

Answer 2

个人建议使用

http://www.fontsquirrel.com/

它位于您的服务器上，并且与几乎所有浏览器兼容！自从使用Font Squirrel以来，我就没有再寻找其他替代品。

- Brad Fletcher

---

Font Squirrel和Google Web Fonts一样存在同样的问题。如果字体没有正确提示，它们只能以其核心大小正确显示。OTF功能根本不起作用。如果您想要连字，那么上帝保佑你。 - SickHippie