分类
WEB++技术

非系统默认字体实现方法之比较

http://www.funnyapple.com/compare-methods-among-nonsystem-font.html

在公司的项目中,基本上都会出现非系统默认字体。对一个专业的网页设计师来说,选择适合网站的字体是非常重要的。较早之前,我们会用图片来实现,如果是单语言的网站来说,这个方法也只能算是马虎应事,但没有灵活性可言。另外在外企我们所接触的项目80%要求多语言,更多时候需要考虑灵活性。其实是网站不管是不是多语言,对于一个专业的页面重构师来说,工作不应只是还原页面,还需考虑页面的可扩展性,维护性和性能。

目前就我所用过的3种方法实现非系统默认方法做个大概的比较:

第一种:font-face

@font-face:能够加载服务器端的字体文件,让客户端显示客户端所没有安装的字体。IE只支持微软自有的.eot格式,FF3.5+、Opera 10+、Safari 3.2.1+浏览器支持支持ttf,otf两种格式字体。

优点:不依赖于其它技术,在CSS中简单地定义;浏览器的兼容性也非常好。

缺点:字体文件的许可证问题;网络安全问题。

个人总结:从写法上来看,确实优于另外两种方法;但表现上,却没有另外2种来得更贴近效果图(因为设计师在字体上经常用到滤镜,而font-face出来的效果,难达到效果。)

第二种:sifr(Scalable Inman Flash Replacement)

优点:文本可选,较好的用户体验;不违反EULA 或版权,因为字体是在SWF文件中,而且我们可以定义阴影,Hover等效果

缺点:加载的时间缓慢;需要Javascript和Flash才能够看到效果。在实现上的,字体大小极易受高度和宽度影响。

个人总结:Beemster项目时,用到sifr,发现sifr会受到外层的高度及宽度的影响,从而改变已定义的font size,较难控制,影响日后的维护和扩展。

第三种:Cufon

优点:加载的时间比比sifr快,而且只需要javascript就行,有着所有typeface.js的优点,本身也较少缺陷。

缺点:由于嵌入字体违反EULA和版权;文本不可选,用户体验性这块较差。

但针对这三种来说,个人比较喜欢Cufon,基本上现在的项目,我都使用cufon。它可以很好地渲染你定义的style,即使大量文字被替换其速度还是相当不错,唯一 不足就是文本不能选中。

ps: Cufon的line-height只有在DOCTYPE中 Strict下才有效果!

http://cufon.shoqolate.com/generate/

http://www.cufon-font.com/

unicac

...long long ago,he have a dream.

发表评论

邮箱地址不会被公开。 必填项已用*标注