Redesigned ampersand of the new Lucida Grande, old version in red

Lucida Grande “Retina-optimized” in OS X Mavericks

As pointed out by Stepen Coles yesterday, Ars Technica wrote about a modified version of Lucida Grande, “optimized for Retina displays”, in their review of the new Mac OS 10.9 “Mavericks”. So, what exactly could make a font “optimized for Retina” and which modifications did Apple make?

Always curious about these kinds of slight modifications depending on the technology, resolution or size, I had a quick look at the new Lucida Grande fonts that come with Mavericks. The first noticeable thing is that instead of two fonts – Regular and Bold – the new .ttc font collections contains four fonts, two of them being the supposedly retina-optimized versions. There must be some mechanism in Mavericks that swaps out the fonts depending on the display.

Lucida Grande now includes two additional font files

Lucida Grande now includes two additional font files

The more interesting question is, of course, what is the difference between the old and new design, which I will simply refer to as “2012” and “2013” here. After opening both versions of the Regular style, my FMX Compare Fonts macro spits out that outlines were changed in 115 glyphs, components were modified in 43 glyphs, metrics were adjusted in 64 glyphs and kerning pairs were added.

Let’s have a look at the redesign in detail:

Kerning

Did you ever know or notice that Lucida Grande did not have any kerning whatsoever? In any case, now it does. My assumption is that the fonts were optimized for Mac OS, which, presumably did not support kerning for the relevant UI elements so kerning was dropped. Does this mean that kerning was added for the “Retina” version because now Mac OS does support kerning in UI elements on Retina displays? Unfortunately, I do not have a computer to test this; feel free let me know if you find out.

[update] Thanks to Stephen’s screen shot from Finder on a Retina display, this has been confirmed.

Mavericks-Finder-kerning-test

Lucida Grande in Finder in Mavericks on a non-Retina display is not kerned

Mavericks-Finder-kerning-test-Retina

On a Retina display, kerning is applied

Is kerning a resolution-related update? One could argue that kerning does not make much sense in low-resolution full-pixel environments. If each character has a full-pixel width and can only be kerned by multiples of one pixel then we have many kerning values that are either too small to have an effect (since they are less than half a pixel) or, even worse, we end up with over-kerning for those pairs that are rounded away from zero. I have observed this problem when I do proofing for my web fonts and I sometimes tone down some kerning pairs for the screen version in order to avoid these cases where a kerning value rounded to the full pixel is too much.

Mavericks-Finder-kerning-test-Retina-detail

Detail of the above screenshot. On a retina display, subpixel positioning is activated. Note the differences between the pixel images of the two A’s

In that sense, the real reason why kerning makes more sense in Retina mode is not the increased resolution but the subpixel-positioning that is not active on standard displays. This means that in Retina mode, characters can have fractional widths and, of course, we can have fractional kerning values. Even kerning less than one pixel is expressed through a different sup-pixel positioning of the character shapes in relation to the pixel grid. Can we call it “Retina-optimized” through kerning? I’m fine with that. [end of update]

Redesigned character shapes

Some characters seem to be consciously re-designed. These are some changes I found most noticeable:

Lucida-Grande-2012-various

Lucida Grande Regular

Lucida-Grande-2013-various

Lucida Grande Regular, Retina optimized

It seems that in fact, some of the features in Lucida that make it a particularly robust design were re-touched for the “Retina” version.

The q of the new Lucida Grande with the old version in red

The q of the new Lucida Grande with the old version in red

If you look carefully at the q, you will notice that the thinning of the stroke as it touches the straight is reduced. In my opinion, calling this tweak a “Retina optimization” is justified although it is more the removal of a low-resolution optimization.

Lucida-Grande-2013-k

The k of the new Lucida Grande with the old version in red

The k is a less obvious case. In the older version, the diagonals are barely touching the upright, which is certainly a feature that helps against clogging up in low resolutions. However, it is also a stylistic decision and removing it is not necessarily an improvement even though it is less necessary in a high-resolution environment.

Redesigned ampersand of the new Lucida Grande, old version in red

Redesigned ampersand of the new Lucida Grande, old version in red

Lucida-Grande-2013-at

Redesigned @ of the new Lucida Grande, old version in red

The new @ and & are clearly an improvement, they just looked a bit wonky before, as you can see in the overview above. While this is obviously not a resolution-specific adjustment, I appreciate that they took the chance and made some further corrections to the design. It’s a pity that non-Retina user like me won’t get to see these improvements, though.

Lucida-Grande-2013-y

Lucida-Grande-2013-t

Some other changes such as to the t and y are a bit difficult to understand. To me, the thickening of the y tail certainly looks wrong and does not have a functional purpose.

Redesigned spacing

The new Lucida Grande was not only adjusted in terms of character shapes. The spacing, i.e. the space before and after each character, was also redesigned, most notably the s and x.

Lucida-Grande-2012-s-spacing

Lucida Grande Regular

Lucida-Grande-2013-s-spacing

Lucida Grande Regular, Retina optimized

The old s was clearly too loosely spaced, as a few of my usual test words reveal. I’m glad this was fixed but hasn’t the left side-bearing of the s become a bit too tight?

Components

For file size efficiency and ease of design, fonts typically contain accented characters built of components, i.e. references to the base letter and the acent. For some reason the new Lucida Grande has some of them decomposed, i.e. as plain outlines.

Lucida-Grande-2013-racute

The r with acute in the new Lucida Grande. The plain r is shown in red.

Is it a technical glitch? Some of the accented characters show deviations from the plain base letters, which is surely not intentional.

So what?

I’m glad to see this update as it shows Apple still takes typography seriously. Although like most designers, I don’t like the use of Helvetica as a UI font in iOS, there are also promising font-related developments. While small tweaks like the ones we looked at here may seem nearly insignificant, it shows there are efforts to improve type in Apples OSes.

As another example, I’m quite excited to see how the new size-aware “Dynamic Type” in iOS develops and/or spreads. I have long been interested in the subject and have done some research myself, published under the somewhat clumsy name “Size-specific adjustments to type designs”. Apple is now using the term “size-specific adjustments” in their documents, which makes me enjoy the illusion I might even have contributed a little to that development.

15 thoughts on “Lucida Grande “Retina-optimized” in OS X Mavericks

  1. miles

    I don’t know where the phrase ‘ optimized for retina display’ was written, but it appears to me that it simply means improved. Most changes appear to be fixes unrelated to resolution. I really can’t see why they old files were included unless some compatibilities issues were found with the new fonts, perhaps the addition if kerning and spacing that relied upon it.
    Were the changed to the bold very similar?

    Reply
    1. Tim Ahrens Post author

      Sure, as I pointed out above, some changes were probably unrelated to the Retina update. I can imagine they included the old versions since the Mac OS font rasterizer is supposed to be hevaily tweaked to make Lucida Grande look good. In other words, while Mac OS applies its automagic rendering to all fonts disrespective of the hinting, Lucida grande seems to be a special case. At least that is what I heard, it might be a rumour that is not true. With different shapes, these tweaks would get lost.

      I haven’t had a look at the bold style yet, this was a rather quick shot.

      Reply
  2. Jens Kutílek

    Thanks for doing the detective work, Tim! I noticed there’s a new table «meta» in the fonts. The format is undocumented, perhaps it controls the switching between the different versions?

    Reply
    1. Tim Ahrens Post author

      That sounds quite reasonable, Jens. My “detective work” was more a case of curiosity, not meant to completely solve all the questions.

      Reply
  3. Jeff McCarty

    I thought that I noticed text looking a little “murky” once I upgraded to Mavericks but couldn’t quite identify the problem. After reading this, I realized what to look for. I have an rMBP with an external display. It uses the new version of Lucida Grande on *both* displays, so the kerning issues you described actually show up in the finder when I drag the window to the external non-retina display.

    Reply
    1. Will Parker

      Also seeing the new kerning for Lucida Grande in the Finder on my Mid-2010 MBP (1280×800 display), 10.9

      Reply
    2. Stephen Coles

      Craig, I don’t think there is any kerning in your sample. Note that the two lines are the same length, indicating that the space between letters does not change depending on the pairs. While in my screenshot the same number of characters differ in length due to the tighter kerning with an ‘AT’ pair. What you’re seeing is just that Lucida Grande’s ‘A’ and ‘T’ have very narrow side-bearings — which is a good thing as it compensates when there is no kerning enabled.

      Reply
      1. Tim Ahrens Post author

        In Craig’s example, there are 7 Ts in the first line but only 6 in the second. So, we need to ignore the last T in the first line, which means there is indeed kerning.

        Reply
  4. dr.no

    Since 10.8, Screen Fonts have been deprecated.
    That means fonts are spaced using their floating point number
    instead of integer spacing found prior to 10.8.

    Reply
  5. D. A. Hosek

    The Lucida family was designed to work well with technologically-limited computer systems. That means that there were no kerning pairs (having kerning enabled/disabled doesn’t matter if no pairs exist) as well as having a number of other optimizations employed (f-ligatures are merely logotypes of the characters combined without any graphical changes, for example, shapes deliberately simplified to handle low-resolution rendering, etc.) The first adaptation of Lucida was Lucida Bright which lowered the weight of the serifed version to make it work better in print. Lucida Grande is the original Lucida Sans with its character set expanded to cover a large portion of the Unicode character set (generally speaking, all non-Asian scripts).

    Reply
  6. seo tools

    Hello there, Well put together post. There is an difficulty together with your site in web traveler, could test the following? For instance still is industry innovator plus a large portion of some others is going to pass up your fantastic creating just for this difficulty.

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>