Question

我正在网站上工作，目前使用@ font-face tehnique（this + this）加载字体。我注意到一些特殊字符没有正确加载 - ＆gt; ŠĐŽČĆšđžčć。也就是说，这些字符存在于字体本身中。所以，我做了一个测试...... 我用@ font-face字体和cufon字体加载了一个测试页... 结果如下 - ＆gt;

enter image description here

当然，这是代码 - ＆gt;

<html>
    <head>
        <script type="text/javascript" src="cufon-yui.js"></script>
        <script type="text/javascript" src="ReprobateCRO_400.font.js"></script>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
        <script type="text/javascript">Cufon.set('fontFamily', 'ReprobateCRO').replace('h1');</script>
        <style type="text/css">
            @font-face {
                font-family: 'ReprobateCROLASTRegular';
                src: url('reprob_cro_last_last-webfont.eot');
                src: local('ReprobateCROLASTRegular'),
                     url('reprob_cro_last_last-webfont.eot?#iefix') format('embedded-opentype'),
                     url('reprob_cro_last_last-webfont.woff') format('woff'),
                     url('reprob_cro_last_last-webfont.ttf') format('truetype'),
                     url('reprob_cro_last_last-webfont.svg#ReprobateCROLASTRegular') format('svg');
                font-weight: normal;
                font-style: normal;
            }
            h2{
                font-family:ReprobateCROLASTRegular;
            }
        </style>
    </head>
    <body>
        <h1>--> CUFON --> šđžčć ŠĐŽČĆ</h1>
        <br/><br/>
        <h2>--> @FONT-FACE --> šđžčć ŠĐŽČĆ</h2>
    </body>
</html>

到目前为止，我尝试从utf8，widnwos1250切换编码，似乎没有任何东西可以与@ font-face tehnique一起使用...

所以，我有两个问题......有谁知道这里发生了什么？并且，如果我切换到使用cufon insted @ font-face - 这将减慢页面加载的速度多少？（结合cufon使用JS加载字体）

感谢您的时间！

Answer 1

我最近在使用@ font-face时遇到了很多问题，而我正在开发一个网络字体密集的网站，结果发现在线网络字体生成工具本身就是有罪的。他们只是生成了 .woff / .ttf / .svg / .otf 文件，导致很多的问题，很难找出问题的根源。

根据我的经验，提供100％有效免费网络字体的唯一在线网络字体生成服务是Font Squirrel。它还允许很多有用的东西，如字体子集，这可能也是你的情况下的问题（即你没有指定在你生成的网络字体中包含其他字符 - 塞尔维亚语/克罗地亚语是拉丁语扩展B的一部分，如果我我没有误会。）

Answer 2

您是否尝试使用http://fontface.codeandmore.com/替代@ font-face生成器？

Answer 3

H2的字体定义错误：单引号丢失。

现在是：

font-family:ReprobateCROLASTRegular;

应该是：

font-family:'ReprobateCROLASTRegular';

Answer 4

你似乎已经解决了字体问题; re：加载时间，我的经验是font-face和cufon都可能足够慢，可以短暂闪现默认文本。这取决于您的主机和用户的连接当然;但这两种方法都需要相对较重的下载（JS或字体）。

所以，其他所有人都相同恕我直言你也可以使用font-face;至少浏览器在缓存字体文件方面越来越好，因此在初始页面加载后，您可以获得更快的渲染速度。使用cufon，它总是必须加载并执行JS，因此你永远不会摆脱那部分加载时间。

Answer 5

你的实施很好。

但是当你使用font-face时。您使用的字体。必须包含您想要使用的所有字符。 .ttf或者当你使用它时必须包含所有字符和特殊字符。

当你使用Cufon时。 Cufon发生器为您制作了许多额外的字体字母。在Cufon的字体生成器中。您可以为字体选择很多额外的内容。

你明白吗??

@ font-face vs. cufon

5 个答案: