I often get requests to supply photos for online publication or a contest where the editor specifies the dpi or “dots per inch.” It’s usually a certain number of pixels wide “at 300 dpi” or “72 dpi,” or sometimes all they ask for is “a 300 dpi image.”
But I’m here to tell you that those are nonsensical specs. Setting an image’s dpi* for online or screen viewing is literally meaningless.
Why? Because the image’s dpi is 100% determined by the screen it’s seen on. And nothing I do, no dpi setting, can change that.
The dpi you see on any screen — in your Web browser, on a digital projector, in Photoshop, on your Apple Watch — is the hardware dpi of that particular screen. The image on that screen is a certain number of pixels wide and a certain number of pixels high, and there is no dpi setting that alters that.
Here’s an example: Let’s say I have a digital image that’s 1000 pixels wide. My desktop computer monitor displays about 100 dots per inch, so that image will appear to be 10″ wide on my monitor, because every 100 dots of that image occupy one inch of the display. Got it? That same image on my iPhone 6, which displays 326 dots per inch, will appear to be a little over 3″ wide, because every 326 dots of that image occupy an inch of iPhone screen.
Do you see a pattern? A 1000-pixel-wide image occupies exactly 1000 pixels of any screen. Altering some dpi setting in Photoshop cannot change that basic fact of physics. The only way to make that image appear bigger or smaller or more or less pixelated is to change the number of pixels of the width or height of the image.
So why does Photoshop even have a dpi setting? For printing.
When you print an image, the software determines the number of dots per inch on the paper.** (dpi is also important in other areas, such as scanning.) Paper isn’t locked into 100 dpi or 326 dpi. You get to determine the number of dots that fill each inch.
So what is it that I really need in a request for an image that’s to be displayed onscreen?
Pixel dimensions — that’s it.
Tell me the exact number of pixels wide or high.*** Here’s what I like to read: “Send a jpeg that’s X pixels on its longest side.”
And I ESPECIALLY like to prepare an image that’s the exact size you’ll display it. If your site displays images at 850 pixels wide, I can make very careful sharpening decisions when I shrink the image to exactly 850 pixels wide. If I carefully prep an image, and your code shrinks it to fit a bigger or smaller space, the resulting blurry image will break my heart.
* Technically, a screen displays ppi or “pixels per inch,” but let’s not get technical.
**Of course it’s more complicated than that. “What about my 300 dpi printer?” you ask. That’s a topic for another day. Or for here: bit.ly/1Oeh2Sv
***You can also tell me if you need the image in TIFF or jpeg format, but you should know that a highest-quality jpeg is going to be identical to a TIFF on any screen.