哪种网络字体格式的质量最高?

发布于 2024-10-05 11:21:17 字数 286 浏览 4 评论 0原文

我发现有些网站使用 @font-face 但它们看起来令人毛骨悚然且令人毛骨悚然。没有抗锯齿,但是其他一些网站使用了一些质量非常高的字体,我不知道他们是否使用OTF或TTF或SVG或者到底是什么,这是一个示例

我查看了他们的来源,但有大约 4 种字体类型,我不知道正在使用哪一种。

谢谢

I've seen that some websites use @font-face but they look creepy & without anti-aliasing, But some other websites use some fonts with a very high quality, I don't know if they use OTF or TTF or SVG or what exactly, This is an example.

I've looked into their source but there is like 4 font types and i can't figure out which one is being used.

Thanks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

锦爱 2024-10-12 11:21:17

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

  1. 字体质量。有些字体制作较差,有些字体缺少字符,有些有连字问题等。我建议在所有浏览器上测试该字体在做出承诺之前。
  2. 字体的浏览器渲染。 Chrome、Safari、FF 和 IE 以不同方式显示渲染字体。
  3. 浏览器可读的格式:每种格式也只能读取格式数量有限。 (IE 为 EOT,几乎所有其他内容为 TT,包括 FF 等等)。

结论:网络字体仍然是一种黑暗而神秘的艺术。总是会有细微的差别。 查找构建良好的字体,并在目标浏览器上进行测试。我认为我们仍处于 @font-face 的试错阶段,但是 有很好的资源可以一路提供帮助。

There are three factors that affect quality display of the font:

  1. Quality of the font. Some fonts are poorly made, some are missing characters, some have ligature issues, etc. I suggest testing the font across all browsers before committing to it.
  2. Browser rendering of the font. Chrome, Safari, FF and IE display render fonts differently.
  3. Formats readable by the browser: each also can only read a limited number of formats. (EOT for IE, TT for pretty much everything else, including FF, and there's more).

In conclusion: web fonts are still somewhat of a dark and mysterious art. Invariably, there will be minor differences. Find a well built font, and test it across your target browsers. I think we're still very much in the trial and error phase with @font-face, but there are good resources to help along the way.

梦太阳 2024-10-12 11:21:17

如果您想在网络上使用特殊字体,那么格式选择几乎是由浏览器为您选择的,您将需要 EOT、WOFF、TTF 和 SVG 全部可用。

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

If you want to use a special font on the web, then the format choice is pretty much made for you by the browsers, and you will need EOT, WOFF, TTF, and SVG all to be available.

A site like FontSquirrel will provide guidance as well as the font files themselves.

守不住的情 2024-10-12 11:21:17

字体质量很大程度上取决于字体的转换方式。您可以选择删除影响抗锯齿和质量的内容,例如字距调整,以节省文件大小,许多人都这样做。外观越好,尺寸越大。影响字体的另一个因素是主机操作系统。他们的某些操作方式会影响字体的渲染方式。

另外,这只是随机的,但您可以将其放入代码中:

text-shadow: transparent 0 0 1px;

它将改进抗锯齿功能,尽管目前仅在 Google Chrome 中。

The font quality largely depends on how the fonts are converted. You may choose to remove things that effect anti-aliasing and quality like kerning to save file size which many people do. The better the look, the bigger the size. Another factor that goes into the fonts is the host OS. They have certain ways they do things that can affect the way fonts render.

Also, this is just kind of random, but you can throw this into your code:

text-shadow: transparent 0 0 1px;

It will improve anti-aliasing, albeit only in Google Chrome for the time being.

紫﹏色ふ单纯 2024-10-12 11:21:17

当涉及到 Windows 时,使用 @font-face 的嵌入字体在ClearType ON 下渲染得非常糟糕。

尝试这个彻底的实验:关闭ClearType 关闭,然后重新检查字体渲染。

虽然这似乎没有意义(应该发生相反的情况),但您应该发现字体现在看起来平滑自然。

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

我仍在尝试确定解决此问题的方法,因为显然您不能要求所有使用 Windows 查看您网站的人都关闭 ClearType,以便您的字体看起来不错。

When it comes to Windows, embedded fonts using @font-face render horribly with ClearType ON.

Try this radical experiment: turn ClearType OFF, and recheck the font rendering.

While this seems to make no sense (the opposite should happen), you should find the fonts now look smooth and natural.

This happens for me and I can provide evidence if necessary. The same web page will render fine in Linux, Mac etc without doing any such OS-level tinkering. Yay Windows.

I am still trying to determine a work-around for this, because obviously you can't ask everyone looking at your website who's using Windows to turn ClearType off so your fonts will look good.

时光倒影 2024-10-12 11:21:17

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

I have done some experimenting with a complex font on various browsers while making a web site. I have found that without exception, Firefox and Chrome just don't render the font well regardless of format. IE was limited to eot anyway. And surprisingly, Opera does the best job. Quite frankly, changing the format just didn't make much of a difference. Overall, I think browsers have a considerable way to go when it comes to rendering complex, intricate fonts.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文