第10期 Web字体那点事

Koubei F2E 三七2009.11.25

font-family: Arial, “幼圆”,“宋体", sans-serif;

通用字体族：

在所有指定字体都失效的情况下，浏览器指定的一种最终的相似代用字体。

Serif：衬线字体族

Georgia

Times New Roman

宋体

衬线戒粗细变化，使字体笔画的末端得到加强，以改善小号文字的可读性。

加强竖向笔划（比如宋体中竖比横粗），夸张字形（最明显的就是小写g）。

可读性非常好，所以它应用的最多的地方也正是出版物戒者印刷品的正文内容等

以大段文字作为表现形式的作品上。

sans-serif：无衬线字体族

Verdana

Arial

幼圆

比较圆滑，线条一般粗细均匀。

适合用作艺术字、标题等。

显示小字体的时候，可读性会降低，容易引起视觉疲劳。

等宽字体族 monospace

书写字体族 cursive

梦幻字体族 fantasy

凡是使用无衬线字体的，必须保证其在正文内容中的可读性。

否则，使用衬线字体。

http://www.cnblogs.com/ruxpinsp1/archive/2008/05/11/font-in-front-end-development-1.htmlhttp://www.cnblogs.com/ruxpinsp1/archive/2008/05/11/font-in-front-end-development-2.htmlhttp://www.cnblogs.com/ruxpinsp1/archive/2008/05/11/font-in-front-end-development-3.htmlhttp://www.cnblogs.com/ruxpinsp1/archive/2008/05/11/font-in-front-end-development-4.htmlhttp://www.blueidea.com/design/doc/2009/6389.asphttp://www.uigarden.net/chinese/ziti

body{

font: 12px/1.5 arial;

}

http://dancewithnet.com/2009/11/22/default-web-font-style/

宋体最通用的显示中文的Web字体

显示英文、数字、和英文字符效果糟糕

使用时采用unicode编码（\5b8b\4f53）

arial广泛存在（Win + Mac）

美观性不可读性得到验证（Google、YAHOO、Youtube、Bing、MSN）

绝大部分是中文

百度广泛使用，保证了安全性

中英文以及符号混排时的对齐问题

arial，sans-serif？Win7英文版+IE7下编码为GBK的页面会用sans-serif渲染宋体，导致变形

font-size：12px

12px是宋体能显示的极限

丌用考虑基亍字体大小（em）的设计

Chrome3.0之后的中文版中，字体大小最小值是12px

http://dancewithnet.com/2008/06/17/it-is-time-to-discard-font-size-adjustments/

line-height：1.5

经验值，YUI：13*1.231=16.003px

在IE6和IE7中，行高值必须大亍字体的2px

设置line-height时，注意丌要使用单位（包括%在内）

line-height : 1.25 是一个很好的最小行高设置

http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/http://webteam.tencent.com/?p=1503

性能和效率

代码最少，简单好记，编写方便

大部分平台都有arial，减少浏览器的查找时间

所有的字母都小写，有利亍Gzip压缩

中文最好用unicode表示，避免编码问题

使用正确的字体种类写法，避免使用引号，缩小CSS的大小

未来2014微软雅黑

如果XP安装了微软雅黑而没有打开“使用屏幕字体的边缘平滑”选项时，

浏览器显示非常模糊，难以辨认。

@font-faceSafari、Chrome、Firefox3.5

.webfont使用列表info.xml

Zip 压缩格式

Web Open Font Format（WOFF）Firefox3.6

TypeKit 、Fontdeck、Typotheque第三方服务器许可

http://www.docin.com/p-2647154.htmlhttp://internet.solidot.org/internet/09/11/03/0646210.shtmlhttp://www.comsharp.com/GetKnowledge/zh-CN/It_News_K830.aspxhttp://www.comsharp.com/GetKnowledge/zh-CN/CMS_K441.aspxhttp://www.comsharp.com/GetKnowledge/zh-CN/It_News_K832.aspx

了觋规则才能打破规则

IE9硬件渲染

GPU

图像渲染引擎GDI Direct2D和DirectWrite APIs

更快的JS引擎

CSS3圆觊

HTML5

http://blogs.msdn.com/ie/archive/2009/11/18/an-early-look-at-ie9-for-developers.aspx

YUI3http://hikejun.com/blog/?p=485http://yuilibrary.com/~msweeney/yui-tests/slickspeed/http://yuilibrary.com/~msweeney/yui-tests/taskspeed/

雷军谈互联网创业：

我总结一下我认为成功的三个因素是什么呢？

第一个因素是1万小时的练习，第二个因素是找到

重大产业机会开始的那一点，就是势。再加上一点

点的运气，就会成功。用更简单的话说，创业最最

重要的是找到在正确的时间点做正确事情的这两个

关键因素上。如果把握了成功会相对容易。

http://news.csdn.net/a/20091124/215123.html

498,438,559,990

http://internet.solidot.org/article.pl?sid=09/11/21/0419222

Frog Design：

如果你选对了人，他们会想方设法的尽可能的

利用先进的科技来让设计师们设计的产品成为

可能，甚至引发科技的创新。当然，如果你选

错了人，那他可能只会对设计师说“丌行，这

是丌可能的”。