什么网络字体格式具有最高质量？

Question

我看到有些网站使用@font-face，但它们看起来令人毛骨悚然。没有抗锯齿，但是其他一些网站使用的是一些质量非常高的字体，我不知道他们是使用OTF还是TTF或SVG，或者究竟是什么，这是example。

我查看了他们的来源，但有4种字体类型，我无法弄清楚正在使用哪种。

由于

Answer 1

有三个因素会影响字体的质量显示：

1. 字体的质量。有些字体制作不当，有些字符丢失，有些字符有连字问题等。我建议在提交之前在所有浏览器中测试字体。
2. 浏览器呈现字体。 Chrome，Safari，FF和IE显示字体的呈现方式不同。
3. 浏览器可读的格式：每种格式也只能读取limited number of formats。 （EOT for IE，TT几乎所有其他东西，包括FF，还有更多）。

总之：网络字体仍然是一种黑暗和神秘的艺术。总是会有微小的差异。 Find a well built font，并在目标浏览器中对其进行测试。我认为我们仍然处于@font-face的试错阶段，但there are good resources一直在帮助。

Answer 2

如果您想在网络上使用特殊字体，那么浏览器会为您提供格式选择，您将需要EOT，WOFF，TTF和SVG。

像FontSquirrel这样的网站会提供指导以及字体文件本身。

Answer 3

对于Windows，使用@ font-face的嵌入字体可以使用 ClearType ON 进行渲染。

尝试这个激进的实验：转动关闭ClearType ，然后重新检查字体渲染。

虽然这似乎毫无意义（相反的情况应该发生），你应该会发现这些字体看起来很流畅自然。

这种情况发生在我身上，如有必要，我可以提供证据。相同的网页将在Linux，Mac等中呈现良好状态，而无需进行任何此类操作系统级别的修补。是的Windows。

我仍在努力确定解决方法，因为很明显你不能要求每个看着你网站的人都使用Windows来关闭ClearType，这样你的字体看起来会很好。

Answer 4

字体质量很大程度上取决于字体的转换方式。您可以选择删除影响抗锯齿和质量的内容，如字距调整，以保存许多人所做的文件大小。外观越好，尺寸越大。进入字体的另一个因素是主机操作系统。他们有某些方法可以影响字体呈现的方式。

此外，这只是随机的，但您可以将其添加到您的代码中：

text-shadow: transparent 0 0 1px;

它将改善抗锯齿功能，尽管目前只在Google Chrome中使用。

Answer 5

我在制作网站时在各种浏览器上做过一些复杂的字体试验。我发现无论格式如何，Firefox和Chrome都无法很好地渲染字体。无论如何，IE仅限于eot。令人惊讶的是，Opera做得最好。坦率地说，改变格式并没有太大的区别。总的来说，我认为在渲染复杂，复杂的字体时，浏览器还有很长的路要走。