Web Type Will Save Us (Or, Who’s Afraid of the Big, Bad Retina Display?)

WITH RETINA DISPLAY technology on the verge of ubiquity and some of today’s best web design minds rightfully fretting about it (see PPK, Stephanie Rieger, Brad Frost, and Stuntbox if you’ve missed this latest Topic Of Concern), it seems to this old web slinger that web type is poised to replace photography as the dominant element of web design aesthetic appeal in the next few years.

After all, responsive web design already called upon us to create and swap multiple versions of the same image. And now Retina Displays reveal the lack of quality in all web images — compelling us, perhaps, to create high-resolution image versions which some users lack the bandwidth to download, and to lather our sites with yet more JavaScript as we try to detect whether or not each user’s device requires a higher-res image (shades of 1999!).

But type is type is type, and the higher the resolution of the device, the better that type will look, with no bandwidth overhead.

In that spirit, although we haven’t yet worked with it ourselves, we welcome the launch of TypeButter. Developed by David Hudson and designed by Joel Richardson, TypeButter is a plug-in that “allows you to set optical kerning for any font on your website.”

Soon, CSS and browsers will let us set type properly without the need for widgets and plug-ins. Until then, widgets and plug-ins fill the gap. Thank you, David and Joel, and all you beautiful web type designers and polyfill wizards.

9 thoughts on “Web Type Will Save Us (Or, Who’s Afraid of the Big, Bad Retina Display?)”

  1. Here we go again. First it was:

    “OMGZ0RZ, teh mobilez are coming – quick, we need to reduce all image sizes for small-screen layouts!”

    Now it’s

    “Mobile devices are cropping up with high-density screens¹ so we need to increase all our image sizes!”

    Am I the only one seeing a problem with this? I agree with the idea that scalable technology like web type will go a long way to mitigating the problem, but how many people pay that much attention to it? Everyone is spending all their time cooing over transitions in Webkit while conveniently forgetting the fact that it (or at least Chrome, the poster child of shiny browser functionality) renders type like recycled arse on Windows because it still uses GDI’s one-dimensional subpixel anti-aliasing and doesn’t even support ligatures.

    Typography is hugely important on the Web – but it’s not sexy enough to drive browser development, and it seems only Mozilla cares enough to do anything about it.

    ¹ I refuse to use Apple’s marketing terminology to describe a generic feature – there were high density screens on Android handsets 2 years before the iPhone 4.

  2. It’s our hope that browsers will give granular control over type soon. Joel and I had a lot of fun working on TypeButter but it’s one of those things where we really just want the web to catch up to print as quickly as possible. I’m grateful for the retina display as it gives developers the push we need to be more deliberate with our typefaces. Thanks for taking our cause to the public :)

  3. There’s certainly a fair reason to embrace a more type led approach but dealing with the smaller clients that most web designers who don’t have the client rosters of you big dogs you’ll still find the biggest problem is simply going to be small images supplied by clients.

    Not all of them have the archives or the means to get photoshoots done and this was certainly a deciding factor in a site I recently worked on and I’m sure will be even more so in the near future.

    http://www.welcomebrand.co.uk/thoughts/small-images-big-layouts/

    James.

  4. Incredibly proud of my brother David who made this plugin. He is always building things that have mass appeal. When we were kids Dave and I would always do cool things together (we ran an old school ProBoard BBS and started a web design company). He has build some other cool things too, Bacon! and a MailChimp WordPress plugin.

  5. 3 words: S. V. G.

    SVG has long been a hope, but it is buggy in the very iOS devices that sport the new Retina displays, plus – just like type – it won’t take the place of photos. I actually foresee a shift in design sensibilities while this technology change goes on around us: I see designers focusing a lot more on type and a lot less on images, be they photo or SVG.

  6. Yeah, I think we’re going to see a re-evaluation of the fundamentals while this shakes out.

    “Fuzzy Wuzzy was a bear,
    Fuzzy Wuzzy had no hair,
    Fuzzy Wuzzy wasn’t fuzzy, was he?”

    Well, on the iPad3, yeah.

    Fonts, color schemes, how best to construct narrow columns pinterestingly, and ems and percents make a comeback.

    As a wise lyricist once said: What’s hard is simple. What’s natural comes hard.

  7. It’s a tough one, but I just launched http://www.RetinaSwitch.com as a solution to this problem! A central site that allows you to disable retina images (set and forget) for developers that implement the simple API into their sites. If it is wide spread enough then the benefits are tremendous,

Comments are closed.