All we need is to be able to define the physical size of a box, a font, or whatever, and everything would work beautifully.
Yesterday, Apple announced the new iPad mini, and since it has the same screen resolution of the iPad 2 (and the same browser resolution of iPad 1,2,3,4) we have a bit of a problem as publishers. Here is the 10" iPad next to the new iPad mini, both showing the same app. As you can see, the difference in physical screen size makes quite an impact on the size of the text on the screen.
Apple said that the reason why they didn't change the resolution, was that they wanted to make it easy for developers. It allows them to maintain the status quo, because no developer will have to redesign their apps for the smaller screen.
While that might be true for many apps, it's not true for publishers who rely, to a large extend, on text. Because the screen is rendering the apps in the same resolution, the actual font size appear about 3pt smaller on the iPad mini.
In other words, it's very likely that your font size will be too small to read in a comfortable way on the iPad Mini.
This is not only true for publishers who have created dedicated apps for their newspaper and magazines. It's also true for web publications designed with a responsive design (like this one). Because the browser resolution is the same as on the 10" screen, every website designed to 'fit' will suddenly look like it was written with a 3px smaller font.
There are two ways to solve this:
1. You could detect the device (if possible) and create a specially designed template for the smaller iPad Mini. You will probably be able to do this within an app, but, at this point, we don't know if we can do same on the web.
We have to check the iPad mini user agent (which isn't available yet), and hope that it identifies the iPad mini - instead of just an iPad.
If it doesn't, we have a big problem, because there would then be no way for us to identify if our web publication is displayed on a 10" screen, or on the smaller 7.9". In other words, we would not have any way of adjusting the fonts to match.
2. The other solution is to design all tablet experiences for the 7" tablet, and then just let it scale up to the 10" screens. This is far from optimal, but it's a lot better than an app that uses too small a font.
There is also a third solution, which I wrote about in "Retina Displays are Tricky For Publishers", which is that we should abandon using pixels to define our formats. Pixels only works if our screens have the same dpi, but they don't. And as a result we get the mess that you see above.
A much better solution is to design like we do in print, using centimeters (or inches). That way, we could say that 'this box' should be 10 centimeters wide and it would be 10 centimeters on all our devices, regardless of screen resolution, dpi, etc. Same thing with fonts. You would define the font size in how big it should be in centimeters, and that would then be the font size regardless of what device or screen people use.
This would solve all our problems, but, alas, the people who make browsers are complete nincompoops. They have apparently never heard of the ruler.
Here is a simple example. I took this picture earlier today of a box that I had defined to be 10 centimeters in width ... and as you can see, all the boxes are in different sizes:
The actual size of a box defined as "width: 10cm;"
When I define something to be 10 centimeters, it should be 10 centimeters. What part of that does the browser manufacturers not understand?
It's because of this tiny thing that we, as publishers, have so many problems optimizing our designs for mobile devices. All we need is to be able to define the physical size of a box, a font, or whatever, and everything would work beautifully.
For now, we have to be content with creating the workarounds we need to make our apps and responsive web publications as beautiful as possible. Either by trying to detect the device and adjust the styles and templates accordingly, or just test every single device and implement whatever compromises that we need to make.
And then we can all hope that soon the angry lady above will give Apple, Google and Microsoft a good whupping, and fix this problem. It's not a complicated issue to solve. All I want is to be able to say: "this should be [x]cm in size", and then that's the size it is ... regardless of what device it is on.
It's not rocket science!
Head over to my Google+ to discuss and comment on this problem.
Founder, media analyst, author, and publisher. Follow on Twitter
"Thomas Baekdal is one of Scandinavia's most sought-after experts in the digitization of media companies. He has made himself known for his analysis of how digitization has changed the way we consume media."
Swedish business magazine, Resumé