使用@ font-face或cufon而不是图像更好吗?

时间:2011-03-05 08:04:55

标签: font-face cufon

我有一个需要Trade Gothic的网站。我想知道是否更好的做法是使用@ font-face或cufon使用与Trade Gothic类似的字体或者只是去图像路线。显然,使用图像会更好地看,但更好的做法是什么?例如,是用下面的图像替换标题标题?

<h2><span>title here</span></h2>

span { display:none }
h2 { background:url(image.jpg);display:block;height:x;width:y }

4 个答案:

答案 0 :(得分:1)

这取决于您的要求的严格程度以及目标受众群体中的浏览器支持,特别是如果您想支持移动设备。

如果使用类似外观的字体足够好,那么要求可能真的是一个很好的功能,所以任何优雅降级的东西都应该有效。 @ font-face似乎最容易实现(只是CSS和字体文件),它不需要Flash或JavaScript(适合移动用户)。 Google Web Fonts是一个很好的资源,您甚至可以使用像this one这样的生成器创建自己的网络字体。

您必须决定什么最适合您的大多数受众,并权衡需求的灵活性。如果您使用基于JavaScript的解决方案并且受众禁用它,那么这是一个交易破坏者吗?图像替换本质上并不是很糟糕,但如果你有很多内容要担心(特别是如果它经常变化),维护它可能会很繁琐。

答案 1 :(得分:1)

我同时使用它们。

我喜欢将Cufon用于导航和/或主标题元素,因为我认为它渲染得更好(特别是在Windows中)。

对于任何子标题和其他文本,我使用@ font-face,以便用户可以选择文本。

答案 2 :(得分:1)

我正在用@font face替换标题图像,因为它们可以更快地加载,并且文本总是更加SEO友好,但是在执行此操作时必须小心,因为这会增加http请求,这可能需要更长时间才能加载。关于哪些字体可用于网络也存在一些法律问题。

然而,当没有其他字体可以做时,它是特别理想的。

据我所知,自IE 4以来,@ font face的FYI浏览器支持已经可用。

答案 3 :(得分:0)

嗯,@ font-face和cufon对你提到的图像替换方法最明显的优点是它们动态生成文本而你不必为你想要替换的每个文本创建一个图像

看看这里: https://stackoverflow.com/questions/692990/sifr-vs-cufon-vs-typeface-js

相关问题