webfont定义及使用方法.docx

web font定义、使用方法及优势web font又叫网络字体，网络字体是CSS3中的一个模块，他主要是把自己定义的特殊的字体嵌入到网页中。web font是在线引用字体，免安装、免下载，通过调用云端服务器存储的字体，直接显示字体效果。由于字体必须安装在本地才能显示，对于网站制作者&前端老湿们来说，为了确保显示效果，长期以来不得不一直使用“安全字体”，英文网站一律是 Verdana，中文网站一律是宋体、黑体等因为这是每台电脑里肯定装有的字体。web font的出现彻底改变了这一现状，以后有什么好看的字体想用就用了。这得归功于国外IT技术人员对字体效果不懈的追求，对技术不断的创新。由于现在流行的浏览器版本较多，而每个浏览器支持的技术也不一样，所以要使web font匹配所有的主流浏览器，需要设置好几种字体格式。w3c最近推出的woff格式得到了所有厂商的认可，我想在不就的将来就会完全统一了，当下还得按照如下方法引用。web font的使用方法如下：在head中定义好font-face，设置好字体的引用路径，然后设置好引用该字体的css样式，比如上面web font的定义。以上设置已经支持当下所有的主流浏览器了。虽然技术上可以使用户下载云端服务器的字体了，但是问题又来了，网站服务器拥有的字体很少啊，而且市面上大部分字体都是有版权的，不能随便使用啊。针对这个问题，产生了很多提供web font的服务商。它们拥有很多字体，网站设计者们只需要引用它们的字体就好了，这省去了网站设计者们寻求字体源及寻求字体版权的问题。国外比较出名的web font厂商有typekit、google font等。特别提醒，google font是免费使用的，有google作为后台，大家也使用的安心。现在英文web font的使用问题都解决了，可是中文的问题又来了。英文因为只有二十六个英文字母所以字体文件很小，可是中文不一样，动辄好几兆甚至上十兆，以目前的网络速度，根本不能用啊。typekit、google font也只提供英文web font的。google font出来了两三年国内都没有动静，国内网站设计者们也只能望洋兴叹！国内的商业字体厂商的思维还是停留在平面和印刷上，他们并没有重视或者发现网络这块市场，以至于多年来，除了开源的文泉驿，我们没有见到有太多字体创新，更没有看到各大字体厂商有向网络字体方面的任何努力。就在国内网站设计者们盼星星、盼月亮的期待中，今年国内终于有了第一家中文web font字体服务商有字库。由于刚开始，有字库还准备不充分，现在使用它们网站的字体是免费的。我也使用了一下它们的服务，使用非常简单，分css引用和javascript引用两种模式，反正就是几句js代码的事。最为关键的是直接引用它们的代码就能实现所有浏览器的匹配，我们完全不用担心匹配问题了。在这我就不多说了，需要的同仁去百度搜索。以上说了web font的现状和使用方法，以下说说web font的优势有哪些。1. 网站设计者们可以无限制的使用好看的字体了，包括设计字体、手写字体等，好的设计当然需要优美的字体呈现。2. 不是图片，是字体不是生成图片，而是使用真正的文本，您可以像文本一样复制粘贴。现在国内的网站设计者们都是将漂亮的字体做成图片，但是web font是真正的文本。3. 优化搜索引擎排名虽然图片也可以呈现中文字体，但是Google、百度等搜索引擎无法辨认出图片的文字内容，无法搜索到网站相关内容。 使用网络字体（web font），则是呈现的真实的文字，无论是标题、内容都适合引用。4. 无级缩放不模糊，好的使用体验图片在放大和缩小的过程中会产生变形或马赛克，网络字体（web font）采用的是矢量字体，支持无级缩放，不管放多大或缩再小都不会产生变形或模糊，给用户一致的体验。5. 文本修改及编辑更方便图片每次都得重新编辑和生成，耗费人力和时间，扩展很不方便，而网络字体（web font）是真正的文字，随时可添加删除。好了就说这么