快好知 kuaihz

还是网页字体这事

网站中常用见的字体就是“宋体”。但现在很多电子商务网站都会有标价,这就涉及到了符号和数字,然后品牌和内容中又会有英文和字母,这就又涉及到英文字体,光用“宋体”会不协调。因为“宋体”本身是为中文字符设计的,符号、数字和英文、字母当然也应该使用英文字体来定义显示才会更合适。

前几天做一个项目我们决定使用font-family:Verdana,Tahoma,Arial,b8bf53(宋体),sans-serif的字体显示顺序(先别管合理不合理),我们测试了IE6/IE7/IE8/Firefox/chrome/(使用以上几款浏览器访问我们网站的用户加起来占90%以上),在IE7/IE8浏览器中显示英文和数字时字体有区别(见下图)

“Aisleep”和“88”感觉上面有明显的锯齿而下面的感觉粗厚平滑一些。

大家知道,这是因为IE7/IE8浏览器中[属性] > [高级]选项卡 > [多媒体]有一个ClearType(

增强屏幕字体)属性,默认是被选中的原因(见下图)。

如果把这个选项去掉勾,那IE7/IE8浏览器显示的字体就和其它浏览器统一了。反之,通过Windows控制面板 >  ClearType Tuning 启用ClearType(见下图)

对于操作系统控制面板没有ClearType Tuning选项的可以通过以下方式实现:

单击[开始],单击[控制面板],单击[外观和主题], 然后单击[显示]。

在[外观]选项卡上,单击[效果]。

单击选中[使用下列方式使屏幕字体的边缘平滑]复选框,然后单击该列表中的 ClearType[清晰]。

那以其它浏览器显示的字体就会和IE7/IE8统一了。(注:据我调查大多数XP操作系统默认为“标准”)

接下来会看到一些测试和整理,目的只是为了解字体在不同设置下的特性。这里不会有什么字体的推荐设置,因为我认为字体的设置和你所做项目的具体情况有关,没有什么设置是最好的,只要清楚字体在不同设置下的特性才能在以后的应用中得心应手。

测试:12px和14px的字体大小是中文网页中最常见的;字体family:黑体,宋体,sans-serif,Verdana,Tahoma,Arial,Helvetica(没用雅黑字体,雅黑字体在Vista以后的操作系统才有,但根据网站数据统计80%都是XP操作系统,目前兼容性会是个问题);文字加粗容易分辨区别,

下图显示效果不好,这里访问→http://docs.google.com/View?id=ds4hm4h_241f5cpdkff

浏览器:IE6/IE7/IE8/Firefox3.6/Chrome4.0。

整理:

从ClearType角度:除了IE7/IE8外其它浏览器字体显示效果都是一样的,如何统一所有字体显示效果,方法上面已经说过。

本站资源来自互联网,仅供学习,如有侵权,请通知删除,敬请谅解!
搜索建议:还是网页字体这事  字体  字体词条  还是  还是词条  网页  网页词条  还是网页字体这事词条  
设计

 用户很痛苦,我们却在帮倒忙

当痛点被解决,用户往往会对此感到满足。而作为公司则需要进一步思考,考虑到当前的解决方案是否会产生新的痛点。正确的找到用户的痛点,永远是公司的终极追求。从字面意义...(展开)

设计

 动效的高效设计与交付

如何将动效设计打造得更加流畅?怎样才能实现更为流畅的效果呢?在本文中,你将找到答案。在手机淘宝中,大至链路的衔接,小至一个按钮的点击响应,动效是体验无处不在的润...(展开)

设计

 产品设计中的指挥官命令

指挥官命令是指让执行的人明白,如果只能做一件事,那应该是做哪件。最近跟一个产品经理交流,他跟我吐槽:“我让设计师检查一个效果,确定之后再上线,结果你看看,上线之...(展开)