CHAPTER 9 The Next Steps for Web Typography
larger sizes (about 18px and up). The full procedure of converting files for
different uses is well-explained in the wax-o blog article “Font-face render-
ing problem in chrome and firefox: use postscript outlines”^28. A word of
caution: double-check the font’s EULA to ensure you are allowed to make
such changes.
For proper subpixel anti-aliasing, the rendering engine takes information
about the background into account, and so text that sits on a transparent or
semi-transparent layer needs to be anti-aliased against the color that shows
through from the layer in the background. Apple even disables it on the Mac
OS X translucent menu bar. So, if rendering seems a little off, opacity at less
than 100% combined with a difficult background might be the reason.
Finally, in my research I came across a few unofficial sources who
claimed iOS ditched subpixel rendering in favor of standard anti-aliasing,
because subpixel rendering is only possible in a native direction. Support-
ing subpixel anti-aliasing in only one direction would obviously ruin con-
sistency in different device orientations. Indeed, if you take a screenshot
from within an iOS device and zoom in, you will see the light gray pixels in
place of the orange and baby-blue pixels.
However, if you zoom into a photo taken with a simple smartphone
camera, the orange and blue colored fringes are evident. For instance, on
Retina iPhones, the horizontal subpixels BGR (blue, green, red^29 ) sequence
is clearly visible when viewed in portrait, while on iPads the same se-
quence occurs when viewed in landscape (with the volume control buttons
facing up).
I should probably stop at this point, because I can only speculate that
the built-in screenshot app flattens the edge pixels to the respective shades
of gray. But whatever seems to be the case, when it comes to typography
ignore the device specs and trust your good judgment.28 http://smashed.by/postscript
29 While displays exist in different sub-pixels patterns, for instance horizontal RGB, horizontal BGR,
vertical RGB and vertical BGR — horizontal RGB is the most common. http://en.wikipedia.org/wiki/
Subpixel_rendering