当前位置: 电脑软硬件应用网 > 设计学院 > 网页设计 > 正文 |
|
|||
网页设计中字体设置详解 | |||
2010-2-21 14:06:29 文/woniu 出处:电脑软硬件应用网 | |||
浏览器默认的样式往往在不同的浏览器、不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏览器的默认设置保证各个浏览器样式一致性的做法。 拿字体来说,各个浏览器默认的字体种类、字体大小和字体行高都不一样,比如IE8的中文版在Windows XP下显示网页时默认字体是宋体,而英文版肯定不会如此。所以我们需要统一设置默认的字体样式,以便实现一致的显示效果来保证设计的一致性和提高开发效率。 样式优先级 第一层是浏览器的默认样式 字体:arial 1.Windows和Mac都预装了这款字体,应该是使用最广泛的网页字体了。它的潜在对手tahoma和helvetica 2.视觉设计的专业人士可能会认为在Windows中使用tahoma、在Mac中使用helvetica更好,比如淘宝的默认字体样式是font: 12px/1 Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;这是一个很不错的选择,但是你也会发现Google、YAHOO、Youtube、Bing甚至MSN的新版都使用 3.一般情况下设置font-family都会在最后设置通用字体族以保证其安全性,比如Google的设置为 4.因为中文字体的选择非常有限,所以目前所有的主流浏览器都设置使用宋体来显示中文。Baidu的首页和搜索结果页使用 使用英文字体作为第一默认字体会导致的问题之一就是中英文以及符号混排时的对齐问题、通过设置行高和hasLayout能解决绝大部分情况,但是都不会很完美,如果把字体改成“宋体”能彻底的解决问题。很明显,这个问题只出现在IE上。所以,如果你的网站很少使用英文、数字和英文符号,那么直接设置 大小:12px 1. 12px是宋体能显示的极限,虽然微软雅黑能显示更小的字体,但目前的应用环境尚未成熟。由于宋体基本上是目前显示中文唯一的通用Web字体,所以12px成为最常用的字体大小。我们当然可以依据产品的需要来修改这个默认值。 2.不用考虑基于字体大小(em)的设计。 3.在Chrome3.0之后的中文版中,字体大小最小值是12px,比如你设置最小字体为10px,最后也变成12px。 行高:1.5倍 1.这是一个经验值,不同的产品对这个值要求可能不同,但我们一般会设置最常用的为默认值。比如YUI的font中是 2.在IE6和IE7中,行高值必须大于字体的2px才能保证字体的完整显示或当其作为链接时能有效显示下划线。 3.设置 4.深入CSS 行高非常有利于理解 性能和效率 1.大部分平台都有 2.代码最少,书写方便。 3.所有的字母都小写,目前Google就是这样做的,好处是既可以编写更快也能提升Gzip压缩的效率。 4.中文最好用unicode表示,比如使用宋体是 5.使用正确的字体种类写法,避免使用引号,这样可以缩小CSS的大小。中文字体可以按上一条方式来编写。 未来 1.通过对中英文及符号混排的测试, 我发现微软雅黑其实表现相当不错,包括英文数字和英文字符以及在IE6和IE7的显示效果上,但唯一的遗憾是在XP下如果安装了微软雅黑字体的用户没有打 开“使用屏幕字体的边缘平滑”选项的话,在firefox、Safari和Opera、特别是IE6下会非常模糊难以辨认。针对这个问题目前并没有很好的 解决方案,所以只有等到IE6使用比率非常小的时候才可能正式的使用它。或许需要到2014年,XP死掉的时候。 2.虽然很早就有了@font-face,但是浏览器的支持、网速和商业问题,导致它很少被应用。最近关于字体的好消息是Firefox3.6将支持Web Open Font Forma。关于Web字体未来的相关信息可以看Web 字体的未来、关于 Web 字体:现状与未来和再谈 Web 字体的现状与未来。 |
|||
最新热点 | 最新推荐 | 相关文章 | ||
页面自动跳转的几种实现方法 网站内容的四种分类形式 或多或少的… 如何指定规范网页?rel="canonical" 浅谈网站评论体系设计的不足之处 网页中“上一篇”“下一篇”设计思考 网页设计进度指示器帮助用户预测步骤 网页用户体验:网页注册表单设计分析 网页设计常出现8大问题 网页设计的形象思维归纳 彻底去掉动易内容页顶部的“改变图片… |
关于45IT | About 45IT | 联系方式 | 版权声明 | 网站导航 | |
Copyright © 2003-2011 45IT. All Rights Reserved 浙ICP备09049068号 |