<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Our Studio11 &#187; Web</title>
	<atom:link href="http://our.studio11.cn/tag/web/feed" rel="self" type="application/rss+xml" />
	<link>http://our.studio11.cn</link>
	<description>中央美术学院 第十一工作室</description>
	<lastBuildDate>Fri, 03 Jun 2011 03:10:40 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>荐：web设计95%是排版</title>
		<link>http://our.studio11.cn/285.html</link>
		<comments>http://our.studio11.cn/285.html#comments</comments>
		<pubDate>Mon, 20 Oct 2008 02:11:41 +0000</pubDate>
		<dc:creator>李沃耕</dc:creator>
				<category><![CDATA[个人]]></category>
		<category><![CDATA[studio11]]></category>
		<category><![CDATA[Type]]></category>
		<category><![CDATA[typography]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://our.studio11.cn/?p=285</guid>
		<description><![CDATA[来源：Realazy
非常好的一篇文章，虽然看似有些偏激。

这篇文章来自一个研究并提供信息架构的网站：Information Architects Japan，原文：Web design is 95% typography.
又及，文章多次出现typography这个单词。正规的中文翻译应该是“排印”，但考虑web这个非印刷媒体，使用排印并不见得好。于是我根据语境，有时用“排版”，有时用“排印”，请读者明鉴。以下是翻译正文。
web中的信息有95%是成文的语言。为何web设计师应该好好学习一下设计成文信息的主要准则，换句话说，排版？这就是最佳的理由。

信息设计就是排版
回到1969年，Emil Ruder, 一个瑞士著名的排印大师，其笔下关于当时的印刷氛围，简直就是我们今天网站的写照：
今天印刷术的泛滥成灾让我们的个人价值被轻视，因为郁闷的我们现在并不能掌控印刷中的一切。分割、组织和实现印刷术的一切是排印师应有的任务，只有这样，读者才有更好的机会找出吸引她／他的东西。

信息设计师是21世纪的排版师
稍微联想一下（请用在线排版取代印刷），这就像是信息设计师的职务描述。分割、组织和实现印刷术的一切是“信息设计师”应有的任务，只有这样，读者才有更好的机会找出吸引她／他的东西。宏观排版（所有的文本结构）跟微观排版（样式和空间的细节方面）包括我们今天称为“信息设计”的很多方面。也就是说，信息设计师今天正在做排印师30年前的工作：
排版面临一个很直白的职责，这就是传达信息。没有理由能免除排版的这一职责。一个并不能阅读的印刷品只能变成一个无用的产品。
优化排版就是优化阅读，亲和力，可用性（！），综合文本平衡等。组织文本块并结合图片，难道不是图形设计师、可用性专家、信息架构师应该做的吗？但为什么这是一个被忽视的主题呢？

 
为什么这是一个被忽视的主题？

字体太少？分辨率低？
 主要原因——抱怨连天的——不看好在线排版准则的观点是，能用的字太少了。第二个观点是屏幕分辨率太低，让像素或者反锯齿字体之一很难阅读。

文艺复兴：只有一个字体
 认为我们没有足够的字体可用的观点是不切题的：在意大利文艺复兴时期，排印师只有一个字体可用，但这个时期还是产生一些顶级漂亮的排版品：

该排印师应该没有太在意他手中手能掌握的字体种类，实际上也不应该太在意字体的选择。他应该更关心时代能赋予自己手中掌握的，并尽力发挥。

选择字样并不是排版
 第二个观点也并不见得好到哪儿去。在印刷初期，印出来的字母质量比我们今天在显示器 上看到的更差。更重要的是，如果处理得专业，屏幕字体更易于阅读。信息设计不是关于使用好的字样，而是关于使用好的排版。两者的区别很大。谁都可以使用字 样，有人可以选择好的字样，但只有少数人能够精通排版。

把文本当作用户界面
 对，不同平台和不同浏览器如何处理字体是恼人的，也对，分辨率问题很难让注意力集中 坚持到五分钟。但是，好啦，确保文本在所有主要平台和浏览器中赏心悦目是web设计师的职责。正确的行间距，单词和字母间距，留白，一定量颜色的使用有助 于可读性。但还不彻底。一个优秀的web设计师知道如何跟文本而不仅仅是内容打交道，“把文本当作用户界面”。瞧瞧Kohi Vinh的网站，你大概会明白他的意思：

稍微著名把文本当作用户界面的 unornamental 网站例子有： google, ebay, craigslist, youtube, flickr, Digg, reddit, delicious. 一个难以争辩的必然事实是，把文本当作用户界面是成功的唯一参数。成功的网站设法同时创建简单的界面和强烈的特征。但这是另外一个主题了。

从哪开始

web排版 
 为了“破除关于web排版的某些荒谬想法”，他已经“按照Bringhurst的工作原则来构建他的网站，并解答如何通过HTML和CSS中可用的技术来达成各项目标”。

优化排版的5个简单步骤 
 他所谈论的排版“并不是你典型的‘该用哪种字体’的排版”。对于相信让字号和行间距默认大小使得文本能够任意缩放会提高网站可用性的人，这是一个不错的阅读材料。

Khoi Vinh 
 behaviordesign的创始人之一。现为NYTimes.com的设计主管。非常天才的一个人。

Rod Graves 
 通讯设计师。令人赞叹的工作：“排版是我绝对的中心。排版网格和层次通常会成为我开发的视觉语言的基础。”

A List Apart 
 通过字样通讯。字体和布局。为读者设计。易读性。字样，图形设计。web排版的问题。控制web排版：字号、字体和颜色。CSS方法，浏览器问题，用户问题和解决方案。

Association Typographique Internationale 
 ATypl(Association Typographique Internationale) 是一个专注于样式和排版的主要国际组织。创建于1957年，ATypl为国际样式社区之间提供通讯的结构，信息和活动。

Thinking with Type 
 书籍Thinking [...]]]></description>
			<content:encoded><![CDATA[<p>来源：<a href="http://realazy.org/blog/">Realazy</a></p>
<p>非常好的一篇文章，虽然看似有些偏激。</p>
<p><br class="spacer_" /></p>
<p><strong>这篇文章来自一个研究并提供信息架构的网站：</strong><a href="http://www.informationarchitects.jp/" target="_blank">Information Architects Japan</a>，<strong>原文</strong>：<a href="http://www.informationarchitects.jp/the-web-is-all-about-typography-period" target="_blank">Web design is 95% typography</a>.</p>
<p>又及，文章多次出现typography这个单词。正规的中文翻译应该是“排印”，但考虑web这个非印刷媒体，使用排印并不见得好。于是我根据语境，有时用“排版”，有时用“排印”，请读者明鉴。以下是翻译正文。</p>
<p>web中的信息有95%是成文的语言。为何web设计师应该好好学习一下设计成文信息的主要准则，换句话说，排版？这就是最佳的理由。</p>
<p><br class="spacer_" /></p>
<p><strong>信息设计就是排版</strong></p>
<p>回到1969年，Emil Ruder, 一个瑞士著名的排印大师，其笔下关于当时的印刷氛围，简直就是我们今天网站的写照：</p>
<p><span class="code">今天印刷术的泛滥成灾让我们的个人价值被轻视，因为郁闷的我们现在并不能掌控印刷中的一切。分割、组织和实现印刷术的一切是排印师应有的任务，只有这样，读者才有更好的机会找出吸引她／他的东西。</span></p>
<p><br class="spacer_" /></p>
<p><strong>信息设计师是21世纪的排版师</strong></p>
<p>稍微联想一下（请用在线排版取代印刷），这就像是信息设计师的职务描述。<strong>分割、组织和实现印刷术的一切是“信息设计师”应有的任务，只有这样，读者才有更好的机会找出吸引她／他的东西</strong>。宏观排版（所有的文本结构）跟微观排版（样式和空间的细节方面）包括我们今天称为“信息设计”的很多方面。也就是说，信息设计师今天正在做排印师30年前的工作：</p>
<p>排版面临一个很直白的职责，这就是传达信息。没有理由能免除排版的这一职责。一个并不能阅读的印刷品只能变成一个无用的产品。</p>
<p>优化排版就是优化阅读，亲和力，可用性（！），综合文本平衡等。组织文本块并结合图片，难道不是图形设计师、可用性专家、信息架构师应该做的吗？但为什么这是一个被忽视的主题呢？</p>
<p><span style="font-size: small;"><br />
 </span></p>
<p><span><strong>为什么这是一个被忽视的主题？</strong></span></p>
<p><br class="spacer_" /></p>
<p><strong>字体太少？分辨率低？</strong><br />
 主要原因——抱怨连天的——不看好在线排版准则的观点是，能用的字太少了。第二个观点是屏幕分辨率太低，让像素或者反锯齿字体之一很难阅读。</p>
<p><span id="more-285"></span></p>
<p><strong>文艺复兴：只有一个字体</strong><br />
 认为我们没有足够的字体可用的观点是不切题的：在意大利文艺复兴时期，排印师只有一个字体可用，但这个时期还是产生一些顶级漂亮的排版品：</p>
<p><a href="http://our.studio11.cn/wp-content/uploads/2008/10/013.gif"><img class="alignnone size-medium wp-image-286" title="typography" src="http://our.studio11.cn/wp-content/uploads/2008/10/013-596x425.gif" alt="" width="596" height="425" /></a></p>
<p>该排印师应该没有太在意他手中手能掌握的字体种类，实际上也不应该太在意字体的选择。他应该更关心时代能赋予自己手中掌握的，并尽力发挥。</p>
<p><br class="spacer_" /></p>
<p><strong>选择字样并不是排版<br />
 </strong>第二个观点也并不见得好到哪儿去。在印刷初期，印出来的字母质量比我们今天在显示器 上看到的更差。更重要的是，如果处理得专业，屏幕字体更易于阅读。信息设计不是关于使用好的字样，而是关于使用好的排版。两者的区别很大。谁都可以使用字 样，有人可以选择好的字样，但只有少数人能够精通排版。</p>
<p><br class="spacer_" /></p>
<p><strong>把文本当作用户界面</strong><br />
 对，不同平台和不同浏览器如何处理字体是恼人的，也对，分辨率问题很难让注意力集中 坚持到五分钟。但是，好啦，确保文本在所有主要平台和浏览器中赏心悦目是web设计师的职责。正确的行间距，单词和字母间距，留白，一定量颜色的使用有助 于可读性。但还不彻底。一个优秀的web设计师知道如何跟文本而不仅仅是内容打交道，“<a href="http://www.cameronmoll.com/archives/001266.html" target="_blank">把文本当作用户界面</a>”。瞧瞧<a href="http://www.subtraction.com/" target="_blank">Kohi Vinh的网站</a>，你大概会明白他的意思：</p>
<p><a href="http://our.studio11.cn/wp-content/uploads/2008/10/022.gif"><img class="alignnone size-medium wp-image-287" title="typography" src="http://our.studio11.cn/wp-content/uploads/2008/10/022-596x364.gif" alt="" width="596" height="364" /></a></p>
<p>稍微著名把文本当作用户界面的 <a href="http://en.wikipedia.org/wiki/Ornament_and_Crime" target="_blank">unornamental</a> 网站例子有： <a href="http://www.google.com/" target="_blank">google</a>, <a href="http://www.ebay.com/" target="_blank">ebay</a>, <a href="http://www.craigslist.org/" target="_blank">craigslist</a>, <a href="http://www.youtube.com/" target="_blank">youtube</a>, <a href="http://www.flickr.com/" target="_blank">flickr</a>, <a href="http://digg.com/design/web_design_is_95_typography" target="_blank">Digg</a>, <a href="http://reddit.com/search?q=typography" target="_blank">reddit</a>, <a href="http://del.icio.us/post?url=http://www.informationarchitects.jp/the-web-is-all-about-typography-period" target="_blank">delicious</a>. 一个难以争辩的必然事实是，把文本当作用户界面是成功的唯一参数。成功的网站设法同时创建简单的界面和强烈的特征。但这是另外一个主题了。</p>
<p><br class="spacer_" /></p>
<p><strong>从哪开始</strong></p>
<p><br class="spacer_" /></p>
<p><a href="http://webtypography.net/toc/" target="_blank"><strong>web排版</strong></a> <br />
 为了“破除关于web排版的某些荒谬想法”，他已经“按照Bringhurst的工作原则来构建他的网站，并解答如何通过HTML和CSS中可用的技术来达成各项目标”。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.markboulton.co.uk/journal/comments/five_simple_steps_to_better_typography/" target="_blank"><strong>优化排版的5个简单步骤</strong></a> <br />
 他所谈论的排版“并不是你典型的‘该用哪种字体’的排版”。对于相信让字号和行间距默认大小使得文本能够任意缩放会提高网站可用性的人，这是一个不错的阅读材料。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.subtraction.com/" target="_blank"><strong>Khoi Vinh</strong> </a><br />
 <a href="http://www.behaviordesign.com/" target="_blank">behaviordesign</a>的创始人之一。现为<a href="http://www.times.com/" target="_blank">NYTimes.com</a>的设计主管。非常天才的一个人。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.rodgraves.com/" target="_blank"><strong>Rod Graves</strong> <br />
 </a>通讯设计师。令人赞叹的工作：“排版是我绝对的中心。排版网格和层次通常会成为我开发的视觉语言的基础。”</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.alistapart.com/topics/design/typography/" target="_blank"><strong>A List Apart</strong></a> <br />
 通过字样通讯。字体和布局。为读者设计。易读性。字样，图形设计。web排版的问题。控制web排版：字号、字体和颜色。CSS方法，浏览器问题，用户问题和解决方案。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.atypi.org/" target="_blank"><strong>Association Typographique Internationale</strong></a> <br />
 ATypl(Association Typographique Internationale) 是一个专注于样式和排版的主要国际组织。创建于1957年，ATypl为国际样式社区之间提供通讯的结构，信息和活动。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.thinkingwithtype.com/" target="_blank"><strong>Thinking with Type</strong></a> <br />
 书籍Thinking with Type的在线伙伴：设计师，作家，编辑和学生的关键指南。</p>
<p><br class="spacer_" /></p>
<p><a href="http://typetester.maratz.com/" target="_blank"><strong>Typetester</strong></a> <br />
 比较屏幕字体样式。</p>
<p><br class="spacer_" /></p>
<p><a href="http://typophile.com/" target="_blank"><strong>Typophile</strong> <br />
 </a>Typophile是一个会员制和赞助商支持的社区。2000年以来Typophile引领开放合作，并且我们总是能学习到好主意。我们他们伺服超过每月3百万的网页。</p>
<p><br class="spacer_" /></p>
<p><a href="http://typophile.com/wiki/start" target="_blank"><strong>Typohile Wiki</strong></a> <br />
 一个有关样式和设计所有一切的用户创建百科全书。用户为建立协作，有用，平衡和相关的资源而创建和编辑条目。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.poynter.org/column.asp?id=47&amp;aid=78683" target="_blank"><strong>The Next Big Thing in Online Type</strong> </a><br />
 比尔盖茨要计算机用户，哦，微软用户，能够拥有一个更舒畅的屏幕阅读体验——太重要以至于提高屏幕阅读成为他最重要的五件事之一。</p>
<p><br class="spacer_" /></p>
<p><a href="http://www.amazon.com/gp/product/3721200438?ie=UTF8&amp;tag=informationar-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=3721200438" target="_blank"><strong>Emil Ruder, Typographie</strong> </a>(Amazon) <br />
 Emil Ruder’s Typography是一本永恒的书，几代排印师和图形设计师都从中学习基本原理。Ruder, 二十世纪最伟大的排印师之一，是一个抛弃并用新的规则取代Emil Ruder传统规则的先锋，来满足新排印技术的需求。</p>
]]></content:encoded>
			<wfw:commentRss>http://our.studio11.cn/285.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>荐：雅黑：即将到来的中文字体革命(web)</title>
		<link>http://our.studio11.cn/241.html</link>
		<comments>http://our.studio11.cn/241.html#comments</comments>
		<pubDate>Tue, 14 Oct 2008 14:02:13 +0000</pubDate>
		<dc:creator>李沃耕</dc:creator>
				<category><![CDATA[新奇]]></category>
		<category><![CDATA[cleartype]]></category>
		<category><![CDATA[font]]></category>
		<category><![CDATA[interface]]></category>
		<category><![CDATA[segoe ui]]></category>
		<category><![CDATA[studio11]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[字体]]></category>

		<guid isPermaLink="false">http://our.studio11.cn/?p=241</guid>
		<description><![CDATA[来源：中国计算机报·数字时代
推荐一下这篇文章，其中详细讲述了中文在屏幕上应用的等等等故事，很有意思，值得看一下。

用Vista的新Segoe UI字体设计的旧金山手工民间艺术博物馆新标志。这家博物馆位于旧金山繁华的Fort Mason中心（崔健在美国开演唱会的地方）码头区，展出来自全球的艺术珍品。馆方认为“用新字体设计的标志看起来很新潮，也很养眼”。
100美元一个字，微软花这么大的价钱打造的新Vista中文字体，到底有多厉害？

“Vista完全可以沿用原来的字体，但启用微软雅黑，将令中文版Vista更加清晰、明亮。”
——微软中国公司客户端产品部总监韦青
 


上图：ClearType显示的障眼法。上面是没有打开ClearType时候的标准显示状态，下面是打开后的平滑显示状态。两者都直接截屏后放大800倍。微软就是用这样的彩色边缘成功欺骗了我们的眼睛。

液晶屏上表示黑和白的两个像素，向左偏移1/3像素和2/3像素时的情况。

随着微软下一代操作系统Windows Vista中文版的公测，一款全新的中文界面显示字体也浮出水面：微软雅黑体。雅黑和Vista一样，仍处于测试阶段，它最引人注目的是，截至目前的0.75beta版，每个字的造价几乎达到100美元——这几乎是有史以来最昂贵的一套中文字库。
微软这样描述雅黑：“Vista完全可以沿用原来的字体，但启用微软雅黑，将令中文版Vista更加清晰、明亮。”最妙的是，它支持WinXP，只要从Vista中提取出来放进字体目录就可以体会Vista的感觉，多棒！这也是雅黑近来这么热门的原因所在。那么，微软为什么要花费巨资开发雅黑呢？

液晶带来的新难题

长期以来，Windows一直采用点阵字库方案作为界面和文本的常规显示模式。中文用宋体，英文用Tohoma。网页制作人员也习惯了11pt/12px的最小字号，用于阅读的正文字体则采用11.5pt/14px。在这个字号下，汉字的显示能达到最美观和易读的效果。因此多年以来大家都相安无事，但是液晶显示器的普及改变了这一切。
液晶新潮时尚无辐射，字体显示清晰无比，但和CRT相比最大的缺点是：插值显示效果惨不忍睹，只能在最优分辨率下看东西。不幸的是，无论液晶的尺寸有多大，最优分辨率下的文字显示都实在太小：比在15英寸CRT上小了足足24%！这对于长时间阅读来说太糟糕了，而对于老年人和弱视人群简直不啻于一场灾难。
 虽然现有的Windows在界面显示中提供了大字体方案，但这种未经优化的点阵大字体粗糙而难看，绝大多数人都无法接受。而更悲哀的是，即便你受得了，IE也不支持。
情况显然非常严重。然而，在苹果的中文操作系统OSX上，已经可以看到一种平滑显示的优美黑体，在系统界面和网页上都可以完美显示。同样，在Linux系统中，也采用了一种“字体渲染”技术，可以在界面上平滑显示矢量中文黑体。但是，在拥有最多用户的Windows世界呢？无论如何，微软必须赶在液晶全面普及之前找到一条可行的界面文字显示解决方案。于是，微软重新翻出了ClearType技术。

ClearType：旧瓶装上了新酒

等等！为什么是重新？因为ClearType的确不是一种新技术了，这是微软于1998年底发布的一项屏幕字体优化显示技术，可以在屏幕上平滑显示矢量字体，以改善LCD的文本显示效果——据说可以将LCD的显示效果提高200%，而且特别适合现有的液晶显示设备，尤其是手持电脑和掌上电脑。效能提高300%？真的这么夸张吗？
我们知道，在计算机上图像的最小计算单位是像素，再优秀的图像处理软件也无法生成比一个像素更小的图像信息。但是，在屏幕显示上，如果你用放大镜来查看屏幕，会发现每一个点都是红绿蓝的栅条所组成的，就算是白点也不例外。事实上屏幕上的所有颜色，都是通过不同亮度的红绿蓝(RGB)固定搭配显示出来的，ClearType打破了局限，将任意三个连续的RGB栅条当成一个像素来显示，从而实现比像素更小的显示精度。
为什么如此优秀的显示技术8年来一直没有广泛应用？因为这种技术仍然是有局限的。首先，普通CRT屏幕的屏幕点阵和液晶屏幕的分布是不一样的，ClearType在CRT上面的显示效果提升没有液晶那么明显，甚至更糟糕；其次，由于液晶的栅条是垂直的，所以这种显示仅仅提升了水平的显示分辨率，假如屏幕发生了旋转——例如液晶常见的90度旋转显示，显示可能会出问题；最后，目前ClearType技术仅仅能用于WinXP/2003和即将到来的Vista中。如果你使用WinXP sp2以上的系统，只能下载一个叫做ClearType Tuner的小工具来微调，遗憾的是，平滑的效果仅仅限于英文，对中文完全不起作用。

更麻烦的中文ClearType字体

在中文系统下，情况就更为复杂了。即使解决了上面的这些问题，仍然有最后一个艰难的障碍需要跨越：中文世界里缺少一套合适的ClearType屏幕正文显示字体。
这款字体必须能解决在ClearType平滑显示状态下小字号正常阅读的问题。现有的所有中文字库都无法在ClearType平滑显示状态下完美地显示文本。我们知道，Windows中的宋体、黑体等字体是由中国北京的中易公司开发的，微软向中易购买了版权之后将其嵌入Windows中文版。之前的宋体之所以能够在小字号点阵状态下很好的显示，是由于在矢量字库中嵌入了12、14、16、18等几个点阵字库，效果才比较理想。但在ClearType状态下，继续采用内嵌点阵显示汉字，就会和平滑显示的英文粗细不一致，风格上非常不协调，此外，强制平滑显示的效果显得纤细发虚，看起来很模糊。
为什么英文可以直接使用ClearType平滑显示？多数优秀的英文字体并不采用内嵌点阵的优化方式，而是一种叫做Hinting（字形微调）的技术来对小字号的显示进行优化。简单点说，矢量字体可以平滑缩放没错，但在小字号下，由于能使用的像素非常有限，系统自动解析会出现笔画粗细不匀，文字之间高低不齐，甚至笔画模糊无法识别等问题。因此必须由字体设计师人工干预，在矢量字库中嵌入附加信息，来告诉字体渲染引擎在某个特定的字号下面，应该如何对这个字符的细节进行修正。
Hinting调整的范围需要涵盖各级小字号，一般最少要包括9px &#8211; 18px这个常用的字号区间。即便对于非常有经验的设计师来说，这也是非常高难度而且费时费力的工作。而中文的笔画繁多，自动解析的错误也就更多更严重。此外，英文只有26个字母，汉字的情况就复杂得多了，仅仅是最常用的汉字就有6000个，全加起来差不多有3万个。仅仅是这矢量造字的工作就是非常浩大的。
这还不算，作为一套功能完整的正文字体，还需要考虑到斜体和粗体的显示，斜体和小字号一样也需要Hinting。为了更完美地显示粗体，微软决定将标准体和粗体分开，作为两套单独的字体来设计，安装时也是两套字体，但在系统中使用时是显示为一套字体的不同状态。这套单独的黑体也同样需要单独造字，然后指定一系列的Hinting和斜体Hinting。
Hinting信息是评价一款优秀矢量字体的一个重要指标，良好的Hinting能在小字号下面提供和内嵌点阵字一样优秀的显示质量，同时又降低内存的消耗。虽然我们现在已经拥有不少不错的矢量中文字体，但适合屏幕显示的正文字体很少，而包含完善Hinting信息的，一个也没有。所以，微软等于是在全新开发一套具备完善Hinting信息的ClearType中文字体，这也正是雅黑如此昂贵的原因之一。
实际上，不仅仅是中国大陆，整个CJK地区（中日韩）都要面临这个全新设计字体的问题。从现在已经发布的版本来看，各国的Vista版本都有全新设计的专用字体，简体中文地区是我们已经知道的微软雅黑，繁体中文地区是微软正黑，日文地区是Meiryo（据说这个名称来源于“明了”或者“明流”的读音），韩国地区则是Malgun。
对于微软雅黑和微软正黑，我们不好简单地用简体或者繁体来区分他们，因为这两套字体都同时包含了比较完整的简繁体汉字，以确保在简体和繁体混排的页面上都能够完美显示。但由于文教部门在各自的文字规范中对汉字的写法规定有很多细节上的不同，所以这两套字形在正式场合是不能混淆使用的。同样，日文的Meiryo字体中也包含了大量的繁体汉字，不过由于汉字在日本也经过了上千年的演变，日文中的汉字写法和中国本土也有着很大区别，更无法混为一谈。

雅黑带来了什么

从本文所附的雅黑网页显示效果示意图可以看出雅黑的几个重点设计理念：
1. 单独设计的粗体。以往宋体的粗体都是通过内嵌点阵或者字体引擎渲染的，效果不是很好。粗体的单独设计意味着另外设计一套字体，所有的时间成本和人力成本翻倍，造价也会翻倍，但是显示效果也会非常好。再考虑到繁体中文和日文韩文都如此处理，微软这次真的下了血本了。
2. 品质优异的斜体。在Windows上第一次看到如此清晰的中文斜体，真的有点令人感动。虽然是14px，但宋体的斜体已经显得支离破碎了。
3. 更清晰的小号字显示。在以往，12px是宋体能显示的极限。比这小的字号会因为没有内嵌点阵而变得模糊。而从微软雅黑的字范来看，11px的显示非常优秀，10px的字基本可以辨认，9px以下，对于汉字的正常显示，已经是不可能的任务了，平常也不会作为正常的屏幕使用字号，但这个极限字号的测试是一个有参考价值的项目。我们可以看到，雅黑在这种情况下仍然还有大约一半左右的字符可以识别出来。
4. 对于最常用的字号，如12px和14px，雅黑的显示非常清晰优美，中英文搭配和谐。同时，和宋体相比，雅黑的字形不是正方形的，而是稍显扁宽，字间距小，使默认的行间距更为明晰，同时使雅黑的字心更为饱满，在同样的字号下，单字面积就显得更大，更容易识别，阅读起来也更舒服。

中文显示的新体验

作为微软中文解决方案的一个重要核心，微软将在IE7、Office 2007以及Vista中全面启用雅黑作为默认的界面显示和正文阅读字体，替代长期以来使用的宋体（中文）+Tohoma（英文）点阵字方案。这将带来怎样的变化？
首先，未来的软件界面将更灵活，更人性化。在解决了字体平滑缩放之后，从Windows本身到各个应用软件，它们的界面字体对比现在将变得更大、更平滑和清晰。用户将可以自己灵活定制Windows和各个应用软件的字体大小，以适应不同场合和不同视力的需要。而软件开发人员和UI设计师需要考虑的是在字体发生变化之后的软件界面还能保持动态的完整和美观，避免在字体变大之后变得支离破碎无法辨识。
其次，雅黑对于互联网，将会有更深远的影响。今后的网页设计会更体贴而人性化，用户将不再需要忍受网页上的小字体的困扰，网页的设计风格将会更简洁而便于阅读。
比如，用户将可以自己选择网页的显示字体的大小。用户会发觉原来大字体下面的网页文字也可以如此优美，不管大字号还是小字号，文本的显示比图片还要平滑清晰。屏幕上的阅读将变得更为轻松。长期以来网页设计人员都喜欢使用css来锁定文字的字号大小，以避免不好看的大字体破坏整个页面的美观。随着ClearType中文字体的推广应用，这种做法会逐渐消失。
另外，网页的风格将会越来越趋于简洁和明快，便于阅读。那些整个版面密密麻麻花里胡哨风格的页面将会逐渐不再流行。因为这样复杂的界面在字体变大以后很容易就被破坏。而网页的界面结构越简洁，就越可以自动缩放和适应这种动态的变化。现在的Web2.0网站已经越来越明显地体现简洁明快的趋势，在一些牛人的Blog和相册站点上，现在已经可以自由缩放，同时保持版面美观一致。
此外，除了不再锁定字号，css的写法也会有新的变化。例如以前用习惯使用固定像素16-20px为单位来确定行间距的设计，在字体放大以后就会挤在一起而无法阅读。因此以后将流行用百分比或者em来确定行距，以自动适应字体的缩放。最后，以往很多粗体的大标题和斜体，由于字体的显示不佳而被迫做成图片，这种局面也将得到全面的改变，大多数常用的字体效果都可以直接在网页上通过css来更灵活实现。
雅黑注定要为将来的Windows界面和网页浏览带来意义深远的革命。所以，不管你是作为一个软件开发人员、一个软件UI设计师，还是一个网页设计师，或者是一个最普通的网民，一个Windows的使用者，都无法忽视它。让我们期待这个全新的时代赶快到来吧。
]]></description>
			<content:encoded><![CDATA[<p>来源：<a href="http://www.ciw.com.cn/epaper/EmList.asp?EmType=3">中国计算机报·数字时代</a></p>
<p>推荐一下这篇文章，其中详细讲述了中文在屏幕上应用的等等等故事，很有意思，值得看一下。</p>
<p><br class="spacer_" /></p>
<p>用Vista的新Segoe UI字体设计的旧金山手工民间艺术博物馆新标志。这家博物馆位于旧金山繁华的Fort Mason中心（崔健在美国开演唱会的地方）码头区，展出来自全球的艺术珍品。馆方认为“用新字体设计的标志看起来很新潮，也很养眼”。</p>
<p>100美元一个字，微软花这么大的价钱打造的新Vista中文字体，到底有多厉害？</p>
<p><br class="spacer_" /></p>
<p>“Vista完全可以沿用原来的字体，但启用微软雅黑，将令中文版Vista更加清晰、明亮。”</p>
<p style="text-align: right;"><strong>——微软中国公司客户端产品部总监韦青</strong></p>
<p style="text-align: right;"> </p>
<p><img class="aligncenter size-medium wp-image-242" title="Vista字体风格的橱窗" src="http://our.studio11.cn/wp-content/uploads/2008/10/20061114102446_1.jpg" alt="" width="200" height="267" /></p>
<p><img class="aligncenter size-medium wp-image-243" title="ClearType" src="http://our.studio11.cn/wp-content/uploads/2008/10/20061114102515_1.jpg" alt="" width="200" height="127" /></p>
<p style="text-align: center;">上图：ClearType显示的障眼法。上面是没有打开ClearType时候的标准显示状态，下面是打开后的平滑显示状态。两者都直接截屏后放大800倍。微软就是用这样的彩色边缘成功欺骗了我们的眼睛。</p>
<p><img class="aligncenter size-medium wp-image-244" title="cleartype" src="http://our.studio11.cn/wp-content/uploads/2008/10/20061114102527_1.jpg" alt="" width="200" height="105" /></p>
<p style="text-align: center;">液晶屏上表示黑和白的两个像素，向左偏移1/3像素和2/3像素时的情况。</p>
<p><br class="spacer_" /></p>
<p>随着微软下一代操作系统Windows Vista中文版的公测，一款全新的中文界面显示字体也浮出水面：微软雅黑体。雅黑和Vista一样，仍处于测试阶段，它最引人注目的是，截至目前的0.75beta版，每个字的造价几乎达到100美元——这几乎是有史以来最昂贵的一套中文字库。</p>
<p>微软这样描述雅黑：“Vista完全可以沿用原来的字体，但启用微软雅黑，将令中文版Vista更加清晰、明亮。”最妙的是，它支持WinXP，只要从Vista中提取出来放进字体目录就可以体会Vista的感觉，多棒！这也是雅黑近来这么热门的原因所在。那么，微软为什么要花费巨资开发雅黑呢？</p>
<p><br class="spacer_" /></p>
<p><strong>液晶带来的新难题</strong></p>
<p><br class="spacer_" /></p>
<p>长期以来，Windows一直采用点阵字库方案作为界面和文本的常规显示模式。中文用宋体，英文用Tohoma。网页制作人员也习惯了11pt/12px的最小字号，用于阅读的正文字体则采用11.5pt/14px。在这个字号下，汉字的显示能达到最美观和易读的效果。因此多年以来大家都相安无事，但是液晶显示器的普及改变了这一切。</p>
<p>液晶新潮时尚无辐射，字体显示清晰无比，但和CRT相比最大的缺点是：插值显示效果惨不忍睹，只能在最优分辨率下看东西。不幸的是，无论液晶的尺寸有多大，最优分辨率下的文字显示都实在太小：比在15英寸CRT上小了足足24%！这对于长时间阅读来说太糟糕了，而对于老年人和弱视人群简直不啻于一场灾难。</p>
<p><span id="more-241"></span> 虽然现有的Windows在界面显示中提供了大字体方案，但这种未经优化的点阵大字体粗糙而难看，绝大多数人都无法接受。而更悲哀的是，即便你受得了，IE也不支持。</p>
<p>情况显然非常严重。然而，在苹果的中文操作系统OSX上，已经可以看到一种平滑显示的优美黑体，在系统界面和网页上都可以完美显示。同样，在Linux系统中，也采用了一种“字体渲染”技术，可以在界面上平滑显示矢量中文黑体。但是，在拥有最多用户的Windows世界呢？无论如何，微软必须赶在液晶全面普及之前找到一条可行的界面文字显示解决方案。于是，微软重新翻出了ClearType技术。</p>
<p><br class="spacer_" /></p>
<p><strong>ClearType：旧瓶装上了新酒</strong></p>
<p><br class="spacer_" /></p>
<p>等等！为什么是重新？因为ClearType的确不是一种新技术了，这是微软于1998年底发布的一项屏幕字体优化显示技术，可以在屏幕上平滑显示矢量字体，以改善LCD的文本显示效果——据说可以将LCD的显示效果提高200%，而且特别适合现有的液晶显示设备，尤其是手持电脑和掌上电脑。效能提高300%？真的这么夸张吗？</p>
<p>我们知道，在计算机上图像的最小计算单位是像素，再优秀的图像处理软件也无法生成比一个像素更小的图像信息。但是，在屏幕显示上，如果你用放大镜来查看屏幕，会发现每一个点都是红绿蓝的栅条所组成的，就算是白点也不例外。事实上屏幕上的所有颜色，都是通过不同亮度的红绿蓝(RGB)固定搭配显示出来的，ClearType打破了局限，将任意三个连续的RGB栅条当成一个像素来显示，从而实现比像素更小的显示精度。</p>
<p>为什么如此优秀的显示技术8年来一直没有广泛应用？因为这种技术仍然是有局限的。首先，普通CRT屏幕的屏幕点阵和液晶屏幕的分布是不一样的，ClearType在CRT上面的显示效果提升没有液晶那么明显，甚至更糟糕；其次，由于液晶的栅条是垂直的，所以这种显示仅仅提升了水平的显示分辨率，假如屏幕发生了旋转——例如液晶常见的90度旋转显示，显示可能会出问题；最后，目前ClearType技术仅仅能用于WinXP/2003和即将到来的Vista中。如果你使用WinXP sp2以上的系统，只能下载一个叫做ClearType Tuner的小工具来微调，遗憾的是，平滑的效果仅仅限于英文，对中文完全不起作用。</p>
<p><br class="spacer_" /></p>
<p><strong>更麻烦的中文ClearType字体</strong></p>
<p><br class="spacer_" /></p>
<p>在中文系统下，情况就更为复杂了。即使解决了上面的这些问题，仍然有最后一个艰难的障碍需要跨越：中文世界里缺少一套合适的ClearType屏幕正文显示字体。</p>
<p>这款字体必须能解决在ClearType平滑显示状态下小字号正常阅读的问题。现有的所有中文字库都无法在ClearType平滑显示状态下完美地显示文本。我们知道，Windows中的宋体、黑体等字体是由中国北京的中易公司开发的，微软向中易购买了版权之后将其嵌入Windows中文版。之前的宋体之所以能够在小字号点阵状态下很好的显示，是由于在矢量字库中嵌入了12、14、16、18等几个点阵字库，效果才比较理想。但在ClearType状态下，继续采用内嵌点阵显示汉字，就会和平滑显示的英文粗细不一致，风格上非常不协调，此外，强制平滑显示的效果显得纤细发虚，看起来很模糊。</p>
<p>为什么英文可以直接使用ClearType平滑显示？多数优秀的英文字体并不采用内嵌点阵的优化方式，而是一种叫做Hinting（字形微调）的技术来对小字号的显示进行优化。简单点说，矢量字体可以平滑缩放没错，但在小字号下，由于能使用的像素非常有限，系统自动解析会出现笔画粗细不匀，文字之间高低不齐，甚至笔画模糊无法识别等问题。因此必须由字体设计师人工干预，在矢量字库中嵌入附加信息，来告诉字体渲染引擎在某个特定的字号下面，应该如何对这个字符的细节进行修正。</p>
<p>Hinting调整的范围需要涵盖各级小字号，一般最少要包括9px &#8211; 18px这个常用的字号区间。即便对于非常有经验的设计师来说，这也是非常高难度而且费时费力的工作。而中文的笔画繁多，自动解析的错误也就更多更严重。此外，英文只有26个字母，汉字的情况就复杂得多了，仅仅是最常用的汉字就有6000个，全加起来差不多有3万个。仅仅是这矢量造字的工作就是非常浩大的。</p>
<p>这还不算，作为一套功能完整的正文字体，还需要考虑到斜体和粗体的显示，斜体和小字号一样也需要Hinting。为了更完美地显示粗体，微软决定将标准体和粗体分开，作为两套单独的字体来设计，安装时也是两套字体，但在系统中使用时是显示为一套字体的不同状态。这套单独的黑体也同样需要单独造字，然后指定一系列的Hinting和斜体Hinting。</p>
<p>Hinting信息是评价一款优秀矢量字体的一个重要指标，良好的Hinting能在小字号下面提供和内嵌点阵字一样优秀的显示质量，同时又降低内存的消耗。虽然我们现在已经拥有不少不错的矢量中文字体，但适合屏幕显示的正文字体很少，而包含完善Hinting信息的，一个也没有。所以，微软等于是在全新开发一套具备完善Hinting信息的ClearType中文字体，这也正是雅黑如此昂贵的原因之一。</p>
<p>实际上，不仅仅是中国大陆，整个CJK地区（中日韩）都要面临这个全新设计字体的问题。从现在已经发布的版本来看，各国的Vista版本都有全新设计的专用字体，简体中文地区是我们已经知道的微软雅黑，繁体中文地区是微软正黑，日文地区是Meiryo（据说这个名称来源于“明了”或者“明流”的读音），韩国地区则是Malgun。</p>
<p>对于微软雅黑和微软正黑，我们不好简单地用简体或者繁体来区分他们，因为这两套字体都同时包含了比较完整的简繁体汉字，以确保在简体和繁体混排的页面上都能够完美显示。但由于文教部门在各自的文字规范中对汉字的写法规定有很多细节上的不同，所以这两套字形在正式场合是不能混淆使用的。同样，日文的Meiryo字体中也包含了大量的繁体汉字，不过由于汉字在日本也经过了上千年的演变，日文中的汉字写法和中国本土也有着很大区别，更无法混为一谈。</p>
<p><br class="spacer_" /></p>
<p><strong>雅黑带来了什么</strong></p>
<p><br class="spacer_" /></p>
<p>从本文所附的雅黑网页显示效果示意图可以看出雅黑的几个重点设计理念：</p>
<p>1. 单独设计的粗体。以往宋体的粗体都是通过内嵌点阵或者字体引擎渲染的，效果不是很好。粗体的单独设计意味着另外设计一套字体，所有的时间成本和人力成本翻倍，造价也会翻倍，但是显示效果也会非常好。再考虑到繁体中文和日文韩文都如此处理，微软这次真的下了血本了。</p>
<p>2. 品质优异的斜体。在Windows上第一次看到如此清晰的中文斜体，真的有点令人感动。虽然是14px，但宋体的斜体已经显得支离破碎了。</p>
<p>3. 更清晰的小号字显示。在以往，12px是宋体能显示的极限。比这小的字号会因为没有内嵌点阵而变得模糊。而从微软雅黑的字范来看，11px的显示非常优秀，10px的字基本可以辨认，9px以下，对于汉字的正常显示，已经是不可能的任务了，平常也不会作为正常的屏幕使用字号，但这个极限字号的测试是一个有参考价值的项目。我们可以看到，雅黑在这种情况下仍然还有大约一半左右的字符可以识别出来。</p>
<p>4. 对于最常用的字号，如12px和14px，雅黑的显示非常清晰优美，中英文搭配和谐。同时，和宋体相比，雅黑的字形不是正方形的，而是稍显扁宽，字间距小，使默认的行间距更为明晰，同时使雅黑的字心更为饱满，在同样的字号下，单字面积就显得更大，更容易识别，阅读起来也更舒服。</p>
<p><br class="spacer_" /></p>
<p><strong>中文显示的新体验</strong></p>
<p><br class="spacer_" /></p>
<p>作为微软中文解决方案的一个重要核心，微软将在IE7、Office 2007以及Vista中全面启用雅黑作为默认的界面显示和正文阅读字体，替代长期以来使用的宋体（中文）+Tohoma（英文）点阵字方案。这将带来怎样的变化？</p>
<p>首先，未来的软件界面将更灵活，更人性化。在解决了字体平滑缩放之后，从Windows本身到各个应用软件，它们的界面字体对比现在将变得更大、更平滑和清晰。用户将可以自己灵活定制Windows和各个应用软件的字体大小，以适应不同场合和不同视力的需要。而软件开发人员和UI设计师需要考虑的是在字体发生变化之后的软件界面还能保持动态的完整和美观，避免在字体变大之后变得支离破碎无法辨识。</p>
<p>其次，雅黑对于互联网，将会有更深远的影响。今后的网页设计会更体贴而人性化，用户将不再需要忍受网页上的小字体的困扰，网页的设计风格将会更简洁而便于阅读。</p>
<p>比如，用户将可以自己选择网页的显示字体的大小。用户会发觉原来大字体下面的网页文字也可以如此优美，不管大字号还是小字号，文本的显示比图片还要平滑清晰。屏幕上的阅读将变得更为轻松。长期以来网页设计人员都喜欢使用css来锁定文字的字号大小，以避免不好看的大字体破坏整个页面的美观。随着ClearType中文字体的推广应用，这种做法会逐渐消失。</p>
<p>另外，网页的风格将会越来越趋于简洁和明快，便于阅读。那些整个版面密密麻麻花里胡哨风格的页面将会逐渐不再流行。因为这样复杂的界面在字体变大以后很容易就被破坏。而网页的界面结构越简洁，就越可以自动缩放和适应这种动态的变化。现在的Web2.0网站已经越来越明显地体现简洁明快的趋势，在一些牛人的Blog和相册站点上，现在已经可以自由缩放，同时保持版面美观一致。</p>
<p>此外，除了不再锁定字号，css的写法也会有新的变化。例如以前用习惯使用固定像素16-20px为单位来确定行间距的设计，在字体放大以后就会挤在一起而无法阅读。因此以后将流行用百分比或者em来确定行距，以自动适应字体的缩放。最后，以往很多粗体的大标题和斜体，由于字体的显示不佳而被迫做成图片，这种局面也将得到全面的改变，大多数常用的字体效果都可以直接在网页上通过css来更灵活实现。</p>
<p>雅黑注定要为将来的Windows界面和网页浏览带来意义深远的革命。所以，不管你是作为一个软件开发人员、一个软件UI设计师，还是一个网页设计师，或者是一个最普通的网民，一个Windows的使用者，都无法忽视它。让我们期待这个全新的时代赶快到来吧。</p>
]]></content:encoded>
			<wfw:commentRss>http://our.studio11.cn/241.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

