协策网络,专业做网站,优秀上海网站制作公司,提供企业建站、网站设计、网页制作,专业网页设计师和网站制作技术工程师为您量身打造个性企业电子商务网站。

此页面上的内容需要较新版本的 Adobe Flash Player。

获取 Adobe Flash Player

  文章汇总 Article Summary
当前位置:协策网络 >> 文章中心 >> 网站建设 >> 浏览文章
 

网页设计师的字体替换方法指南

作者:协策网络-客服部    标签:网页设计     日期:2011年10月17日    类别:网站建设

 

        在国外的设计师幸福地讨论着如何不用图片进行字体替换时,当Google Proudly地提供越来越多的web fonts时,使用中文的网页设计师只能发出一声叹息。中文世界的网页字体窘境,不仅仅是由于中文符号过多造成的字体文件过大这样的技术阻碍;更深一层的原因是,根本就没有几种可用的好字体。

 

 

        一方面,尽管一些中文字体提供商也在致力于提供不同平台的解决方案,字体价格还是贵得令人乍舌,方正字库的年费高达万元,这对普通设计师来说很难承受。另一方面,制作中文字体是吃力不讨好的事,几千个符号和26个拉丁字母完全不在一个量级上;使用正版在中国一直是会呼吸的痛,花大力气做出来的字体,拿不到多少钱,这又降低了制作好字体的积极性。

 

 

       中文网页的常用字体,过去只有“宋体”,现在微软增加了“雅黑”,但“雅黑”还算不上安全字体。在迫不及待地使用雅黑时,我们仍然要注意降级问题。由于雅黑的字体大小、字距和宋体都有区别,我们需要注意降级后,各个用户代理在排版上可能出现的问题。

 

 

        使用非标准字体,最好的方案依然是图片替换。关于图片替换术已有许多文章论述,方法也各有优劣,需要注意的关键点是:

 


1 可用性:注意在无CSS或无图片的情况下,依然能保证文档内容的完整性。尽量减少额外无意义的标签。

 


2 图片负载:利用GIF、PNG8、JPG各自的特点,有针对性地制作替换图片,能有效地减少不必要的图片尺寸。在几种格式中,首推PNG8,即使在IE6中它的透明背景也能被正确显示。PNG8使用的技巧是,输出时把“杂边”设置为和背景接近的颜色。

 

 

        总而言之,中文网页的字体,还没有接近完美的解决方法出现。就像下面这篇文章会告诉我们的,完美不值得等待,只有积极地采用更新的技术,创造更好的作品。而无论中英文字体,是否采用非标准字体永远只是一个技术问题,更重要的是设计师对字体的理解。我们能否理解每一个字符方寸笔画之间的蕴含的意味,并适当地用在设计中,这是我们这些相对落伍的中文世界设计师要艰难完成的任务。

 

 


受够了Arial?厌倦了Times New Roman? 文字替换术(font-replacement methods)在过去的两年中发生了显著的改善,但如果你没有持续关注这项技术,往往很难说出这些方法有什么不同。这篇文章将讨论现今可用的不同的文字替换技巧。

 

 

我们将探讨每种技术的优点和缺点,字体使用授权,以及网络上最好的字体资源,以便于你能在自己的网页设计中开始使用它们。

 

 

入门:字体替换术

 


Since the beginning of the web, designers have been restricted to a limited number of fonts

 


从网页诞生之初以来,设计师们一直被有限数量的字体所束缚。

 

 

         网页设计的潜力看起来正在一天天地增长。HTML5,CSS3和Javascript这样的技术应用带来了很多令人惊喜而有创造性的网站设计。从纯文本的浏览器时代以来,网页已经走过一段很长的路。尽管如此,网页设计中仍然有一个领域相对而言依然停滞不前。

 

 

在任何设计师的“兵工厂”里,要创造网站的外观和“感觉”,排版和字体选择是不可或缺的元素。不幸的是,自网页诞生之初,设计师们一直被有限数量的字体所束缚。能被大多数的网页用户正确显示,设计师能安全地使用的,还能让人提起兴趣的字体是极少的,Helvetica,Arial和Georgia是其中的三种(别忘了Comic Sans)。

 

 

为了摆脱这种限制,用字体来表达创意,设计师使用的传统方法是把文字合并到图片中——然而这种方法有许多的缺点。增加了很多可用性问题,并随着加载时间增加,网站的性能也相应地受到负面影响。

 

 

这篇文章会探讨一些在网页中不用图片加入非标准字体的方法。我们会看到每个方法的优点和缺点,字体的使用授权,以及这项技术对网页设计师到底意味着什么。

Cufón

 

 


要在网页中加入非标准字体,使用Cufón是一个简单、有效得难以置信的办法,它的功能不需要依赖服务端的语言或插件。Cufón只需要几行Javascript代码就能工作,它使用HTML5的画布特性渲染字体,并为Internet Explorer使用VML(Vector Mark-up Language向量可标记语言)渲染字体。

 

 

Cufón在主页上提供了一个字体转换工具,它能将你选择的字体转换为SVG,并为你创建一个Javascript文件,你需要在html中引用它。Nettuts+的Jeffrey Way曾写过一篇关于如何在你的网页中集成Cufón的step-by-step优秀教程。

 

 

Cufón对很多网页设计师来说是一个很流行的选择,因为它有许多优点,相对来说几乎没什么缺点。它不依赖其它脚本语言或插件,这意味着它对相当大部分受众都是可用的,并且被近期所有的主流浏览器所支持,包括IE9。你还可以直接对Cufón替换的文字应用CSS样式,包括比较新的CSS3特性,例如渐变。考虑到速度,它比sFIR要快得多,而且没那么密集,但它仍然不应该被用在主体的大段文字上。

 

 

优点:

 

 

不同的浏览器间很不错的兼容性

 


可以在你的字体中的只包含字符里的特定集合(ABC,123,等等),以便于控制文件体积。

 


CSS字体样式在所有的浏览器中都能保持(颜色、尺寸、阴影⋯⋯)
缺点:

 

 

文字无法选择

 


表现:最好在顶部、标题和副标题中使用



更多
  您可能感兴趣的文章推荐  
 
上一篇:网站策划概述 下一篇:网站建设应该注意的五个问题
协策网络公司拥有专业的网站建设开发团队,超过四年以上的网站建设、网页制作经验,我们可承接企业电子商务网站建设、企业展示型网页设计和功能型网站制作等各类型网站设计制作。
     
首 页  |  基础服务  |  网站建设  |  网站优化  |  成功案例  |  协策博客  |  关于我们  |  联系我们
COPYRIGHT © 上海协策网络科技有限公司 2008-2014 网站地图 SITEMAP 上海做网站公司 沪ICP备08009778号

地址:上海市共和新路425号凯鹏国际大厦13楼G座(近3、4、8号线)

电话:021-51085186 传真:021-56555059 咨询:+(86)18018609689
上海做网站建设网页设计制作公司