我的解决方案：带有 PNG 后备的 SVG 精灵表

就个人而言，我认为图标字体是一种糟糕的权宜之计，5 年内不会出现。如果您需要矢量，SVG 图像是一种更好的方法。SVG 具有图标字体的大部分优点，此外：

• SVG 可以包含颜色、渐变和其他效果。
• 适用于img标签。
• 作为 CSS 工作background-images。
• SVG 是像素完美的。
• 与图标字体一样，SVG 可以缩放到任何大小，因此您可以免费获得 Retina 支持。
• SVG 通常是比图标字体更小的文件。
• 如果你想把所有东西都放在一个文件中，你可以使用 SVG sprite sheet。
• SVG 更容易创建并且可以在 Illustrator 中进行编辑。
• 跨浏览器的渲染更加一致（当然对于简单的事情）。

使用 SVG 的最大注意事项？不支持版本 9 之前的 Internet Explorer。这可能对您来说是一个交易破坏者，也可能不是。WebKit（Safari 和 Chrome）和 Firefox 有很好的 SVG 支持。对于旧版本的 Internet Explorer，您可以将 SVG 精灵表换成 PNG（超级简单，通常只需几行 CSS）。

这应该涵盖所有内容，并且只为您提供几个 HTTP 请求、小文件大小、使用颜色、渐变和其他设计效果的能力。哦，这意味着您不必求助于可怕的 HTML 黑客。事情可以是好的和语义的。

我会推荐图标字体的情况并不多。我认为他们是一个糟糕的主意。一个非常糟糕的权宜之计，将在不久的将来某个时候被埋葬。

您自己提到：“这里的根本问题是在视觉和技术之间保持平衡”。这是我的观点，我相信不是每个人都会同意，但这是我在过去几年在网络工作中观察到的。

网络字体与安全字体：从技术上讲，您不需要网络字体。您可以使用不需要用户下载任何额外文件（请求）的安全文件。你可以结合大小、重量、字母间距和行高来创造奇迹，并可能成功地与他们交流你的信息。在这种情况下使用不同的字体可能只是一种审美选择。

HTML 文本与图形：我认为这没有公式。当网络字体变得非常流行时，无论某些字体在某些操作系统/浏览器上看起来多么糟糕，每个人都加入了字体训练。让我想起了人们是如何背弃桌子的，突然之间，任何使用它们的人都是亵渎神明的。表格仍然是表格数据的最佳选择。在我看来，像素完美的图形仍然是美学设计的最佳选择。

不过，这可能会在不久的将来发生变化。移动渲染很棒，一些新字体在不同设备上看起来很棒。

上次我想“定制”时，我在 3 个不同的操作系统和所有主要浏览器中尝试了字体松鼠中的大多数无衬线字体。我根据他们渲染的好坏给每个人打了 1 到 5 分。他们中的大多数得了 3，少数得了 4。对于个人网站，我选择了一半图形一半字体。就像 DA01 提到的，“这完全取决于客户的需求、客户用户的需求以及正在设计的特定解决方案”（DA01 原文如此）。

@font-face 的“发布”已经有好几年了，尽管我很想在我的设计中使用漂亮的字体，但我仍然没有看到在各种场景中使用呈现如此不同的字体的意义。但这只是我的拙见，我倾向于坚持“什么对我有用”。SVG 的答案听起来很棒，可能会改变我的看法 :)

好的，我会权衡一下我所处的位置，因为似乎没有出现任何固定的方法。

渲染

对于初学者来说，粗略的网络字体渲染的日子很快就会完全过去，至少对于制作精良的字体来说是这样。主要违规者（9 之前的 IE 版本）正在迅速成为过去。IE 8 仍然是一个播放器，但我相信观众无论如何都不是一个有审美动机的人；）

花哨的效果

系统/HTML 文本可以轻松处理
颜色、
不透明度、
比例、
水平和垂直定位
以及文本阴影的更改。

当我的效果开始变得复杂时，我认为这是一个明显的图形类型时刻。除了简单的样式控件（有人愿意添加到我的列表中吗？）之外，您还需要依赖
javascript 库、
支持参差不齐的 OpenType 功能、
用户端过大的网络字体下载，
以及可能支持有限的 HTML5/CSS3 功能。

如果我想倾斜我
的字体，微调字距，
应用纹理，
在图像上精确定位和换行，
或者其他任何需要精确控制的东西，我都会求助于图形。
就像我说的，有一些方法，我只是认为它们在这一点上不值得。

话虽如此，在这些情况下，我还必须问自己是否真的需要效果。无需所有花哨的东西就可以很好地设置系统类型。也许。总有一条模糊的线在某处。

大东西

我发现自己对信任 webfonts 犹豫不决的地方是非常大的字体。只是抛出一个数字，比如说 60px 及以上。这是为什么？我不完全确定，但我能想到几件事而不是让我担心。

一方面，大字体通常需要简单的跟踪无法解决的额外字距调整。字体在页面上占主导地位，每一个小缺陷对我来说都变得非常明显。

其次，这么大的类型往往需要在设计中进行非常仔细的装配。我认为在类型可以流动并且有一些急需的空白空间的内容网站上它不太重要，但在商业网站或密集的内容环境中，错误的换行符或扩展字符可能会造成严重破坏。

我认为这些可能只是浏览器在类型方面做得非常糟糕的日子留下的不安全感。不幸的是，这些问题仍然存在，这让我很谨慎。像Giantnerd 的添加到购物车按钮之类的东西让我想拥抱它:)

最终判决

好吧，也许不是最终的。最终的。

尽管我没有安全感，但我已经摆脱了大字体的事情。而且我发现自己在其他地方使用更少的效果和更干净的系统文本。最大的收获之一是响应更快的布局：系统文本很容易即时更改！

我正在迅速精简我的客户网站并减少对图像的依赖。带上网络字体！也许这将是另一个国际风格的设计复兴时期；）

全面披露

如果我不提及诸如Lost Worlds' Fairs 之类的精彩练习，我将是失职的。这是一个很好的证明，只要有时间和正确的用户群，几乎任何事情都是可能的。