cnhnln 发表于 2014-4-1 22:28:19

(ZT)win、mac、linux字体渲染引擎技术及相关

第4页:UI放大是必要的 Windows7/8 皆支持缩放调整
原文链接: http://www.inpai.com.cn/doc/hard/204972_-3.htm



      Windows 7

                在Windows7环境下,首次连接4K显示器后,几乎每个人都会惊讶:字真小。如果不知道Windows可以缩放UI的话,通常还会抱怨道:这怎么看呀,简直会瞎眼。的确,尽管主机可以识别到显示器的最佳分辨率、尺寸等一系列参数,但Windows7设计当初似乎并没有为高ppi显示器考虑自动调整UI尺寸的设计。因此在首次连接4K显示器未作任何调整时,桌面UI还是依照正常的96ppi习惯设定。
      http://img.inpai.com.cn/article/2014/3/7/e750c449-c76b-40eb-a572-aa48731ccb10.jpg
截图均未更改分辨率,可点击查看原图
                上图就是一张连接4K显示器后默认UI尺寸的桌面截图(以UP3214Q演示)。如果是24英寸的4K显示器的话,大小相当于普通ppi显示器将桌面截图然后横纵皆缩小50%。当然这样的结果是截图便得模糊,而4K显示器由于是原始分辨率,各项目都是清晰的,但是它实在是太小了。
      http://img.inpai.com.cn/article/2014/3/7/2c3e17ae-5067-4243-805a-701046964846.jpg
                在通常96ppi左右的显示器上,原始UI尺寸是很合适的,但在4K分辨率的高ppi场合下,文字、图标等各组件都会非常小。因此想要恢复可读性,需要放大UI。Windows7默认可选125%和150%两个放大选项,对于32英寸的4K显示器来说,150%可以恢复到不错的可读性,但是如果是24英寸的4K显示器,由于密度正好增加了一倍,因此200%才可以恢复到原来习惯的大小,这时需要在自定义中选择,这是延续Windows XP的dpi(ppi)调整选项,调节是无级的,很好用。
      Windows 8
                Metro UI(现正式称呼为Modern UI)在设计当初就是需要对应包括高ppi的平板电脑等不同ppi的显示设备,因此在Metro UI下,Windows8自动针对屏幕ppi设定了他认为合理的UI缩放。虽然在4K显示器上实际效果不太尽人意,好在可以调节,而且桌面应用使用Metro UI的场合不多。
      http://img.inpai.com.cn/article/2014/3/7/2334a40c-cd87-4db2-b7ce-3552050f74b0.jpg
Windows8 桌面截图      http://img.inpai.com.cn/article/2014/3/7/75e510e7-537e-4290-a13d-fb8607eeac8e.jpg
                在桌面环境下,Windows8默认提供最大200%的放大选项,原先的自定义选项择改称为「让我选择一个适合我所有显示器的缩放级别」,效果上是一样的。
第5页:MacOS X 的UI缩放功能将在10.9.3上完美支持



      MacOS X 10.9.1/10.9.2暂不支持,需等待10.9.3
                那么Mac OS X下会怎么样?苹果已经推出了几款Retina显示屏的MacBook,而且在显示体验上也做得非常好。系统会自动对笔记本的屏幕适配最合适的UI尺寸,并且提供手动选择。而且由于Mac OS X UI、图标和字体矢量化程度很高(仅有少数英文字体是点阵),UI放大后一致性保持得也不错,带来高清晰度的同时尺寸合适且没有违和感。
      http://img.inpai.com.cn/article/2014/3/7/7f1b534d-4c20-4dbd-938e-0a0d7fe4eeed.jpg
应用于内建Retina显示器的UI缩放已经相当完善(系统版本为10.9.1)




                        http://img.inpai.com.cn/article/2014/3/10/30e5e1c9-1556-4e66-b73e-0cac400322dc.jpg                                         可是在接驳外接4K显示器后,并没有提供UI缩放选项,仅可以使用适用于原生UI大小。于是和Windows的默认情况一样,菜单、文字小得很费眼睛,而且由于不可以调整UI缩放,体验还不如Windows。
      http://img.inpai.com.cn/article/2014/3/7/11b9cdbd-5d0f-4e60-9b64-0c90aa7c26e8.jpg
MacOS X 10.9.1接驳外接4K显示器无法针对高ppi调整UI缩放       http://img.inpai.com.cn/article/2014/3/7/293bd238-0d4f-4687-936a-b960882677ba.jpg
                上为Retina MacBook Pro内置显示器的菜单栏,高度为42个像素,下为外接显示器后的普通UI大小,高21个像素。如果应用于内建Retina显示器的UI放大可以应用在外接4K显示器上,体验将会非常棒。

      http://static.cnbetacdn.com/newsimg/2014/0307/61_1394170421.jpg_w600.jpg
MacOS X 10.9.3beta 外置显示器UI缩放选项(图片来自网络)

                好消息是,MacOS X在10.9.3beta上已经支持了外接4K显示器的UI缩放,选项与内建Retina显示屏一样,Mac用户只需坐等更新。
第6页:OSX与Windows渲染不同 ClearType效果糟糕


                「增加用于显示同一文字的像素数就会提高文字显示的精细度,文字的显示效果就会更加接近于印刷文字」,一般情况下都是这么认为的吧。但实际上显示用的文字与打印出来的还是有本质的不同。准确地说,是Windows上的显示文字与打印文字有本质的不同,而且至今为止所有版本的Windows都是这样,是一个令人很不开心的消息呢。不过解决方法并不是没有,所以并不用绝望呢。
      ●为提高低ppi显示而造的点阵字
                先说说存在不同的原因吧。字体由于需要在不同尺寸下缩放,因此做成了矢量图形,也就是无论什么样的尺寸,都可以平滑地显示或打印。但像4K这样高精细度的显示器也是去年才发明,在此之前,一般显示器的点距基本上都在100ppi左右,比如前文计算过的23/24英寸Full HD分辨率显示器,约为96ppi。在如此低的分辨率下,用于文章正文的小字号文字只能用极少的像素呈现。比如我们常见的五号字,即10.5pt的文字,在这一ppi下每个字仅有14×14像素用来显示。如此少的像素,如果是矢量字自动缩小显示的话,呈现效果会非常差。因此为了小字号的显示效果,用于屏幕显示的字体内嵌了常见小字号的点阵字:
      http://img.inpai.com.cn/article/2014/3/10/ff6d9452-f773-4376-9506-ef35182a7b3e.png
                内嵌点阵与否的两种宋体在五号字下的对比,很显然内嵌点阵的字体很清晰、而不含点阵的字体会出现笔画粘连的现象,即便没有出现笔画粘连的字,也非常难看。
      http://img.inpai.com.cn/article/2014/3/10/b022f0f0-1379-42dd-94c3-e84f608b67c4.png       放大至200%
                但实际上矢量字体为了保持字体原貌,在文字的衬线、笔画位置等方面没有改变,但由于用于显示的像素数太少,细节完全起到了反作用,导致显示画面一团糟。因此在显示设备上,小字号显示字体内嵌点阵一度是非常必要的。不过毕竟用来呈现的像素数有限,如果是笔画较多的字,就不得不省略一些对可读性没有太大影像的笔画,避免笔画粘连或是糊成一团的情况。
      http://img.inpai.com.cn/article/2014/3/10/7224ef87-4478-4528-a3f7-dfa3a405e60c.png
      http://img.inpai.com.cn/article/2014/3/10/f2dc5660-2590-456d-8706-ca5857cb442f.png
放大四倍

                的确在五号时就有很多笔画如「馨」的「声」和「香」各少了一笔,「露」的「雨字头」仅保留两个点等。在小五号下由于仅有12×12像素,笔画删减情况更加严重。
                但由于汉字是二维文字,每一个字只要用于被正确识别的轮廓不与其他字混淆,就可以保证可以认读,这些地方除非放大仔细看,一般情况下不会察觉到少了笔画。为了保证文字的可读性和页面的整洁,点阵字牺牲了字体的细节和风格,如中易宋体的点阵,实际上作为宋体的重要特证——衬线,已经完全没有了,完全变成了黑体。虽然一些质量更高的点阵如理光的MS明朝(Windows自带日文字体)保留了衬线的表达,但也是在某些地方添上一个像素来艰难地表示自己是衬线字体。
                也就是说,点阵字是对应低像素密度显示器的临时措施,但由于显示器的像素密度多少年并没有提高,因此点阵字也一直被使用着。点阵字的锐利,清晰,和整洁的显示效果,弥补了笔画缺失这一缺点,而且Windows用户已经习惯了。
      ●MacOS X 不更改字体原貌 采用矢量字体渲染方式
                对于用惯了Windows系统的用户,突然间使用MacOS X的话,很多人会觉得文字发虚。实际上,MacOS 9是最后一个使用点阵字的Mac系统,从MacOS X开始,苹果放弃了在普通环境下使用点阵字,仅在少数西文字体还内嵌点阵(如终端中默认所使用的西文字体)
                苹果在显示字体上追求尽可能地还原字体原貌,因此开始不使用会改变字体外观的内嵌点阵方式,而是全部字号使用矢量文字进行渲染,同时在渲染时也力求与实际字体模型不相出入。
                由于像素是方的,比起可以使用单行或是单列像素的直线,在文字斜线和曲线部分会出现锯齿或是粘连,需要对其进行类似反锯齿的渲染处理,以使斜线和曲线平滑显示。
                MacOS X的字体渲染采用横向子像素渲染、纵向灰度渲染的方式。横向的所谓子像素渲染就是借助相邻像素的字像素,即主像素左边一个像素的蓝色子像素和主像素右边一个像素的红色子像素来进行渲染。纵向由于没有子像素可以借用,因此使用灰度渲染。不过由于像素数不是等量的,所以仔细看的话可以看出边缘有多余的颜色。虽然这样可以提高文字的黑度,但明明是黑色的文字在边缘出现杂色,苛刻的用户应该会觉得不太舒服吧。
                另外一点,因为普通点距的显示器对每一个文字使用的像素与前述相仿,因此反锯齿的渲染会导致文字整体比较模糊。对比普通显示器和Retina显示器同样磅值的文字效果就可以明显看出,苹果的横向次像素渲染纵向灰度渲染在Retina显示器上表现更佳。边缘杂色现象也更加轻微。
      ●Windows的ClearType字体本质上还是点阵
                Windows则是在XP(含)之后的版本中加入了一种名为「ClearType」的字体渲染,在Windows Vista开始使用一套为ClearType优化的字体作为UI字体,由于没有传统意义上的点阵字嵌入到字体中,关闭ClearType之后可读性严重变差,因此ClearType被默认开启并作为微软执着的字体渲染方式广泛应用包含Windows Mobile 6.5以及后续的Windows Phone 7/8。
                与苹果追求字体的本来面貌不同,Windows的文字追求清晰,所以ClearType身上可以看到不少点阵字的影子。ClearType仅在横向进行次像素渲染,而仅从纵向来看与点阵字无异。微软在为简体中文Windows使用的ClearType字体是微软雅黑,来自方正的兰亭黑。这套字体对应GBK字符集,包含GB2312以外的文字。但由于仅对常用的简体中文字符优化,在对比人名用非常用字或是繁体、日文汉字时,由于未被优化,会出现严重的粘连等问题。
                果然还是就像没有内建点阵字的矢量字体呢。而且ClearType只能配合微软自己的几款「ClearType字体」,即简体中文的微软雅黑,繁体中文的微軟正黑,日文的Meiryo(メイリオ),韩文的Malgun Gothic(맑은 고딕),英文的Segoe UI等。除去这几款ClearType字体外,使用其它字体时,效果会非常惨。所以尽管我们不知道ClearType内部是否还是有内嵌点阵,但就实际体验来看,把它理解为一种特殊的点阵也不为过。
      http://img.inpai.com.cn/article/2014/3/10/13725383-3143-4eb9-9bab-dddd5d161af1.png
                微软雅黑,ClearType,小五号(10.5pt)。用刚刚三个笔画较多的字来演示的话,可以看到明显的缺笔画现象,实际上比过去的点阵方案还要严重。同时由于利用显示器的次像素渲染需要在文字边缘输出红、蓝等边缘杂色,尽管在正常显示上没有问题,但如果有截图放大的需求的话,会显得很脏,而且可读性反而下降。
                如果仅仅是在小字号显示如点阵的话,那也就不是问题了,现在要说的是在高精细度显示器上,当使用更多像素来呈现文字时,理应回归文字的原貌。但是如下图这样的效果真的可以令人满意么?
      http://img.inpai.com.cn/article/2014/3/10/54028099-752d-433b-ac31-1ebc49742ecf.jpg
                尽管是拥有了更多的像素用于显示,但ClearType模式下的微软雅黑还是一股子点阵味。不但如此,同一字号粗细不一(上部分「毒、影、遭、曝」等字横为一个像素,而其他多数文字是两像素的横),两字号间突然黑度不同,文字高低不一……作为一款字体能找到的缺点几乎都在以ClearType模式下的微软雅黑身上体现了。
第7页:开源的FreeType横向纵向灰阶渲染效果最佳


      
    但实际上方正兰亭黑是一款质量相当高的印刷字体,果然问题还是出现在ClearType身上么?那么在Windows上就没有一种最为接近印刷形态的字体渲染方式么?当然没有这么悲观。

                其实有一种很好的字体渲染方式,我们多数人每天都在使用。由于显示效果极其优秀,很少人注意到,它就是开源的FreeType,应用在Windows98~XP、iOS、Android上,Adobe Photoshop中的字体渲染形势也与此相同。对Windows XP有印象的话,应该记得在ClearType选项处还有一个「标准」(简体中文版WindowsXP中ClearType选项称为「清晰」)。这个「标准」就是早期的GDI32,类似FreeType的横纵灰度渲染,只不过它从Windows98到XP一直没改进过,是5阶灰度渲染,效果一般。



      http://img.inpai.com.cn/article/2014/3/10/9a8a7e0f-764c-495e-97b7-282dc8ccf739.png
                iOS和Android所使用的是改良后的FreeType,完全不理会内嵌点阵,使用字体本身外型的矢量数据绘制文字的输出,就像打印一样。在反锯齿方面,FreeType横向纵向皆进行灰阶渲染,可达256阶,实现平滑的文字效果。



                简单地用实际效果截图来演示吧:




      http://img.inpai.com.cn/article/2014/3/10/313c512b-409d-4d71-965b-72aec03a6d2e.jpg       ClearType不同大小的微软雅黑呈现效果      http://img.inpai.com.cn/article/2014/3/10/0891ac62-f6e4-4535-8f40-092d23ad9481.png       FreeType不同大小的微软雅黑呈现效果
      
的确一眼看去ClearType在锐度上要更好。但缺点也曝露的很明显。最明显的是严重的粗细不一致。由于纵向是完全的无渲染状态,所以在一定字号范围内笔画粗细都是一样的,仅有一个像素宽、两个像素宽、三个像素宽等等。而同样粗细的笔画间的空间随着字号越大而增大,在变成下一级粗细之前,文字的黑度是随着字号增大而降低的。同一文字不同字号下占空比都不一样,显然这一定不是微软雅黑的本来面貌。
                横纵皆有渲染的FreeType可以做到还原字体的本来面貌,在不同字号之间也没有形状和黑度的不同。ClearType要到可以完全无视一个像素和两个像素区别的密度,才可以实现接近字体原貌,起码应该在50pt以上,60多像素见方,这样才能作为正文字体使用的话,那就是横纵至少要达到到目前的5倍,想必至少需要500ppi才可以完美显示吧。显然ClearType不是一个好方案,从目前200~300ppi的安卓/iOS手机使用FreeType达到的效果来看,果然FreeType才是合适的方案。
                那么,我们再确认一下目前像素密度最大的桌面显示器,即24英寸的4K显示器,使用不同的字体,两种渲染方式效果如何。我们选择Windows自带的简体中文字体来看看吧。
      http://img.inpai.com.cn/article/2014/3/10/eed11613-facf-497c-b02f-dcfb097747dd.png
ClearType       http://img.inpai.com.cn/article/2014/3/10/39dd2121-1dcd-4ae5-9cdc-447e4d17e614.png
FreeType                 200%UI下的10.5pt也就是相当于普通ppi下的21pt所使用的像素量,即与用作标题的二号字所使用的像素量相当。约28×28的像素量尽管比普通96ppi下横纵各多了一倍,但由于没有纵向渲染,实际表现依然不佳,横画粗细不一,有生硬的锯齿,衬线或交叉处出现混叠(Aliasing)。即便是为ClearType优化的微软雅黑体,也高低不一的情况还是出现了(对比「正文字体」的「文」字),这就是ClearType自身的严重问题。因此,FreeType是最佳方案再次被验证。
第8页:如何实现Windows下的FreeType字体渲染环境


                FreeType这一开源项目目前一直在持续更新,但并不提供在Windows下直接可以使用的可执行文件。要想使用FreeType接替Windows的ClearType渲染,需要借助一些爱好者制作的成品。
                实际上Windows自带的字体渲染一直受人诟病,很早以前日本就有一个称为GDI++的项目希望改善它,从命名也可以看出来GDI++是为了增强GDI32。最初GDI++是将矢量字体的大字号像素化后缩小显示,其实就是一种最直接的超采样,但是效率低。后来GDI++转而使用渲染引擎,即FreeType。在2006年获得过日本媒体Impress Watch旗下「窗之杜」板块的「Windows Vista先取り賞」(「先于Windows Vista一步」奖)。不过也是在同年9月27日,GDI++停止了更新。
                GDI++停止更新时并不是所有问题都得到了解决,诸如一些进程的渲染bug,乱码以及渲染浓淡等设置需要用户自行调整,并不便利。在GDI++停止更新后,国内极限社区(themex.net)的FlyingSnow基于GDI++的FreeType版进行二次开发,定名MacType。
      http://img.inpai.com.cn/article/2014/3/11/cfe3b2e7-1675-4c88-a3f4-d192367a6904.png                 目前MacType最新版本为去年年底的2013.12.31,在Windows8下的兼容性也得到改善,由于是爱好者的自行项目,MacType没有自己的网站,目前可以在Google Code上获取最新版本的下载。
      http://img.inpai.com.cn/article/2014/3/11/cf1af897-3622-48d2-8910-917f3b1c4516.png                 需要注意的是MacType包含多种渲染方式,其中「灰阶反锯齿」一项即FreeType的横纵向灰度渲染。另外也提供「液晶优化反锯齿(RGB)」即MacOS X上所使用的方式,横向子像素渲染,纵向灰度渲染,用户可以自行选择。程序内提供了不少预设的配置文件,但根据不同的显示器和使用习惯,有可能用户需要自行微调设置。另外预设的Android/Ubuntu风格配置文件理应是灰阶渲染,但实际上配置文件内是次像素渲染,这一点并没有随着版本更新而修正,用户需要自行更改。
                在此首先向FreeType项目、GDI++开发者和MacType开发者以及协助开发的所有爱好者表示感谢。爱好者们毫无报酬的成品让很多Windows用户受益(无论是GDI++还是MacType都一直没有内嵌广告软件)。然而必须承认的是,还有大量的用户对这些配置感到头疼。如果Windows未来会内置优化好的FreeType的话,那么用户可以更简单地使用。不过就微软对ClearType的执着,想必很长一段时间微软内建FreeType是不可能的。

cnhnln 发表于 2014-4-1 22:30:51

原文链接: http://www.inpai.com.cn/doc/hard/204972_-3.htm
原文是介绍4K显示器方面技术和内容的,但是有关字体渲染这块还是值得一看的

npcomet 发表于 2014-4-2 15:00:49

看看账户是不是被盗了
页: [1]
查看完整版本: (ZT)win、mac、linux字体渲染引擎技术及相关