Pixel Envy

Written by Nick Heer.

@2x Pedantry

In less than two weeks, Tim Cook will be kicking off WWDC 2012 with a keynote that’s expected to include details about iOS 6, the first public showing of Mountain Lion, and perhaps something related to a television set. If the rumour blogs are to be believed, Apple will also launch Macs with higher-resolution displays.

There’s plenty of evidence for a transition to Retina displays in shipping versions of Apple’s products. The programmatic user interface, with PDFs in many places instead of images, is just one example. If you poke around in Safari, you’ll find more references. Many of the CSS files used to style the Extension Builder (available in the Developer menu) contain blocks of code that look like this:

@media (-webkit-min-device-pixel-ratio:2) {
    .extension-settings .error-message::before {
        background-image: url(ErrorSmall@2x.png);

The PNG files referenced in these CSS files are not currently shipping in Safari, but they’re referenced throughout. The @2x nomenclature suggests that these files will be exactly double the width and height of their current counterparts, as with iOS Retina assets.

The first line of that block is also important. @media (-webkit-min-device-pixel-ratio:2) looks for Webkit browsers with a 2:1 pixel ratio, as above, and applies the styles in that section. I use it on this website to deliver a higher-resolution magnifying glass in the search field. Apple is using it here to send higher-resolution icons to high-res displays. Since these are referenced in files that are styling the Extension Builder, we can safely assume they aren’t cross-platform, and intended for the iPad. They’re for Retina Macs.

But, as John Brownlee has noted, “Retina” Macs are nearly here, and without doubling the pixels in each dimension. That’s because computers are used at a much greater viewing distance than iPhones or iPads. The 13-inch MacBook Air currently has 82% of the pixel density that it would need for a Retina display, for a viewing distance of 22 inches. To qualify it as a “Retina Display”, it doesn’t need to have a doubled 2,880 by 1,800 pixel display—a 1,920 by 1,200 display would be more than sufficient.

We’re faced with evidence of Macs with displays of greater pixel density. The available information suggests that they do not need to double their pixel count in each dimension, yet Apple seems to be targeting those displays. My bet is that the 2x nomenclature and 2:1 pixel ratio are becoming metaphorical. It won’t literally mean a double-resolution display, but rather a higher resolution display than what is currently expected.

As the Brownlee article notes, it simply isn’t necessary for such a vast number of pixels to give the illusion of solid curves at the typical viewing distance of desktop or laptop displays. Furthermore, such an increase in pixels will have a significant effect on battery life. An increase in pixel density represents a decrease in the amount of light that will pass through any given physical area, which means a corresponding increase in the amount of backlighting is necessary. This is why the new iPad has a battery with a capacity nearly 70% greater than that of its predecessors’.

A 2,880 by 1,800 pixel MacBook would be incredible, though, wouldn’t it?