自定义字体和CMS

Question

我正在为一位艺术家建立一个网站，该网站的手写字体是自定义字体。他想在整个网站上广泛使用这种字体 - 不是因为它很难阅读所有正文，而是标题，导航，标注等等。

我有文件 - 它是一个TrueType字体文件。

我们将使用基于PHP的CMS来构建网站。

为此目的使用此自定义字体的最佳方法是什么，同时仍然允许CMS中的客户端编辑页面名称，标题等？我想尽可能多地容纳用户，但是如果一些网站访问者看到Arial或Verdana或者我们选择用于正文的任何​​内容，那就没问题了。

我应该给@ font-face一个旋转吗？使用PHP在服务器上创建图像？ SIFR？这个网站可能会存在一段时间，所以我希望尽可能地进行前瞻性思考。与此同时，我非常确定没有人可以在自己的网站上使用该字体或下载副本。

他现有网站的一些背景信息： 合理繁忙的网站每天约有500次访问（2000页浏览量）。

浏览器统计信息：

IE：48％（IE6上IE用户占10％，IE7占42％，IE8占48％）

FF：32％（3.5.5的38％，3.0.15的29％，3.5.4的11％，2.0.0.20的4％和3.5.2的5％）

野生动物园：17％（531.9人占53％，531.21.10占13％，528.16占7％，525.22占5％，530.19占4％）

Chrome：2％（3.0.195.33的41％，3.0.195.27的31％，3.0.195.32的21％和4.0.223.16的4％）

Answer 1

我会尝试cufon。字体不会被“保护”。但要将Cufon生成的字体转换回Truetype或Opentype面，需要相当多的技术工作。

Answer 2

最简单的解决方案是使用@font-face方法。如果您包含仅限Microsoft的格式（.EOT），它将在任意浏览器中使用。

查看一些有关字体替换的文章。

http://www.zeldman.com/2009/12/02/bulletproof-font-face/ http://www.smashingmagazine.com/2009/12/01/how-to-support-internet-explorer-and-still-be-cutting-edge/ http://www.jonnyhaynes.com/2009/10/font-face-the-time-is-now/

您可以使用Microsoft的此工具将您的字体转换为.EOT（IE的格式需要）

http://www.microsoft.com/typography/WEFT.mspx

@font-face方法不需要Javascript或Flash，就像之前提到的sIFR和Cufon技术一样，因此更容易被所有人访问。

完全SEO友好和可扩展。

Answer 3

我建议的方法是可扩展的inman flash替换（sIFR），您可以在此处找到相关信息：http://www.mikeindustries.com/blog/sifr/

另一种常见的技术，但我从未亲自使用，是php Image替换。两者都需要使用脚本，因此它们不适用于使用noscript的人，我知道sIFR不适用于Ad Block Plus，但就像你说的那样，你的市场很大一部分它会很好用，看起来很棒。

Answer 4

两种选择（除了SIFR和Cufon，其他人已经注意到）：

通过CSS指定自定义字体：

http://www.456bereastreet.com/archive/200710/the_resurrection_of_downloadable_web_fonts/

http://www.richinstyle.com/guides/fontface2.html#src

创建静态图片：

正如您所注意到的那样，使用自定义字体为每个标题创建图像 - 这也会给想要复制字体的任何人带来障碍。 （当然，他们总是可以从包含字体的图形中追踪字体，并从中轻松创建TTF）。

主要打击是这个问题如下：

“我想确定没有人可以在自己的网站上使用该字体或下载副本”

真的？在不使用静态图像/ flash / SIFR / Cufon的情况下，用户需要将字体副本下载到他们的计算机，以便在其Web浏览器中呈现字体。一旦您将副本提供给用户，您实际上无法控制他们是否在自己的网站上使用它。同样，从静态图像复制字体并为整个世界创建一个TTF来复制是微不足道的 - 请查看像http://www.dafont.com/这样的网站，以获取复制的着名字体示例（例如，Tranformers字体：{{3} }）

Answer 5

@ Font-Face对我很有用。这里有一个生成器，您可以上传您的字体，然后它将为您提供所有格式＆amp;您需要的代码：http://www.fontsquirrel.com/fontface/generator