文本渲染

Sketch 使用操作系统原生的字体渲染，因此文本看起来都会很棒。使用原生字体渲染的好处就是当你进行网页设计时，你可以肯定作品中的文本都是精准的。

Mac OS 系统使用了一种叫子像素抗锯齿效果 （subpixel-antialiasing）的技术来提升文本渲染效果，Sketch 里也是采用的这一种。但有时会出现一些问题警告，我们从一些底层技术来慢慢解释。

子像素抗锯齿技术

一个电脑的显示器是由网格状的像素组成的。文字渲染遇到的问题是普通的屏幕里并没有足够多的像素来精确的展现文字的曲线。这就需要用到子像素抗锯齿技术了，它会将那些被文字曲线遮住一部分的像素稍稍变亮一些，并且在视觉上产生更平滑的效果。

这就是为什么当你在像素模式中把文本放很大观察时，你会看见文字旁边有一些蓝色和棕色的小色块，但是在正常大小时，这些文字效果又没有任何问题。Windows 用户对这种子像素抗锯齿技术不太习惯，他们总是将 Mac 的文字渲染形容成 “很胖”。

无法实现抗锯齿时

顺利实现子像素抗锯齿效果，文本必需出现在一个不透明的（有色的）背景上，因为系统需要知道最终的颜色对比结果是什么样的。这一点与图层混合模式是相冲突的。

要实现图层混合模式，Sketch 需要在一个透明背景上渲染所有的图层，这样这些图层才能像你所期望的那样混合在一起，最终结果再渲染回 Sketch 的白色画布上。

这就会带给我们一个问题，如果没有一个不透明背景我们就不能渲染抗锯齿的文字，但是有了不透明的背景我们又不能渲染图层的混合模式了。这就意味着，一旦你的画布中出现了一个有混合模式的图层，Sketch 就不得不运用透明背景的算法，而无法给文字实现子像素抗锯齿效果了。

你可以尝试对比一下，将一段文本放在不透明背景上（比如填充颜色或者填充了图片的图形）来看看效果。

导出

另一个关于子像素抗锯齿效果的问题出现在导出上。在画布上，Sketch 可以顺利的渲染有色背景上的文本。但当你将文本导出为 PNG 文件，并保持背景透明，你便会发现文本变得不太一样——因为背景是透明的，我们无法在透明背景下渲染子像素抗锯齿效果。

和之前说的混合模式一样，你也可以尝试对比一下，将一段文本放在不透明背景上（比如填充颜色或者填充了图片的图形）来看看效果。

为 iOS 设计

苹果最初发布 iPhone 时，他们决定不用子像素抗锯齿技术来渲染手机上的文字，原因是显示器上的像素都是由红绿蓝的光形成的，而 iPhone 是可以横屏竖屏切换的，也就是说这些本来垂直排列的红绿蓝像素会突然水平排列，这样一来，整个子像素抗锯齿技术就崩溃了。苹果可以保持竖屏时候的文字渲染，放弃掉横屏的情况，但他们理智的决定保持竖屏与横屏的体验一致。

所以每当你在为 iPhone 或者 iPad 设计交互页面，你都需要记住这一点：在画布上，Sketch 会帮你对文字进行子像素抗锯齿渲染，但在移动设备上，文字并不会被这样处理。你需要告诉 Sketch 无需进行子像素抗锯齿渲染，通过 Sketch > Preferences > General, 取消选择 subpixel-antialiasing。