Josh (the blog)

I’ve delivered simple, clear and easy-to-use services for 20 years, for startups, scaleups and government. I write about the nerdy bits here.


@joahua

Computer screen DPI myth and other misconceptions

Or, an article denouncing the “web is smaller” graphic design mantra. Apparently, it’s all about size…

Today I received an email from a graphic designer we’re [base10solutions, that is] collaborating with in building a website, and this comment about source images and computer screens came up:

I know we said to make the flash ones a really hi res picture… but you cant view more than 72dpi over the net anyway.

It’s not as though people who say this are just stupid: the whole “72DPI” myth has been propagated for… a bloody long time. It’s one of those things stuck in the collective unconsciousness of the world’s graphic designers, especially those who have flirted with design for the screen only occasionally.

The designer we’re working with is great… this isn’t in any way against her, but her email provided an opportunity to jump up and down, and there are two reasons for that.

Firstly, monitors don’t all display the same number of DPI, or, more accurately, PPI. I think the emergence of a plethora of display technologies, as well as falling costs in recent years of all kinds of displays, has meant that we’ve seen a huge move away from 15″ screens being standard (I’m hardpressed to find any 15″ CRT monitors new, and even the LCD market is shifting towards 17″ screens) — and “sensible” resolutions on these (1024×768, max) have similarly been abandoned. This means, of course, that the common wisdom regarding display resolution has become irrelevent, and ultimately false.

Let’s do some maths for a second. I hate this as much as the next person, but… well, it’s required.

I’ve got a 1280×1024 screen. It’s roughly 13.3×10.6 inches in size (17″ diagonally), which equates to about 96dpi. Try this:

1280÷13.3=96.2dpi
1024÷10.6=96.6dpi

It’s not horribly complicated maths, but apparently much of the graphic design world hasn’t even bothered to do that much for some time, instead accepting what Photoshop or ImageReady says in all its wisdom when it advises that “72dpi” is for the web. Yeah, okay.

Having said that, an image 600 pixels wide will (in 90% of cases) always be 600 pixels wide when published to the web. This means that it’ll always take up about 58% of an 1024 pixel wide screen… it also means that it’ll take up only 46% of a 1280 pixel wide screen. An image’s embedded resolution has absolutely no impact unless it’s being printed and the software spooling it to the printer understands this.

So, I suppose you could say I’m getting hung up over words (again) — but I’m not really. There’s a perfectly valid reason to provide higher resolution creatives to your web people (if you’re a graphic designer) — they want source resolution just as much as you print junkies do. For the website we’re building, we were going to construct a Flash animation that had a spinning image in it. If we’ve got higher resolution source, it’s possible to do more funky stuff with that (because, in this case, it really is purely about eye candy), just like it is in print (though without the static nature).

It’s worth remembering (especially when a web team are developing end-to-end creative deliverables) that the client is ultimately responsible to some extent for the quality of the finished product. An eye for design isn’t necessarily their sphere of influence, but providing resources to facilitate good design is. And good design is best achieved with good resources.

There’s a common misconception, it seems, that web designers only want creatives supplied in PNG or GIF format. Most print designers realise JPEG images are fairly lossy, so that hasn’t ever been too much of a problem (for me)… but certainly the PNG/GIF thing is. At any rate, just so the world knows, us web people don’t mind more than single layer rasterised images or mockups when building sites.

And we certainly don’t need you to splice the website up for us… that’s been another concern in the past. I’ve spent two hours piecing a supplied website design back together before I even start pulling it apart (again) for CSS treatment!

In fact, in my experience (such that it is), it seems that the less graphic designers think about the fact that the creatives they supply are ultimately ending up on the web, the happier everyone is. So here’s my recommendation: don’t think of it as web anymore. Any web development agency worth their salt should know what to do with whatever source material you throw at them, and if they can’t use it then it’s their job to say, not the designer’s to guess.