Clicky

The Myth Of 72dpi
menu Menu

rjhweb design

rjhweb design

fast, flexible fair

Ninja News

RapidWeaver News & Reviews

The Myth Of 72dpi

I hear on a regular basis that images for web display must be set to 72dpi (96dpi Windows). The statement is simply incorrect.
Video monitors do not work with dpi. They display pixels. To put things straight – dpi/Dots Per Inch is a set of instructions for the printer, for the spacing of the dots/pixels when an image is printed.

So let's get print products out of the way first. Lets take an image of 500px X 375px. If you set it to 3dpi and print it, the print will have 3 X 3 dots spaced across each inch. The physical size of the print will be a whopping 168 X 125 inches, but you'll need to stand around 100 yards away to recognise it.

If we set the resolution of the exact same image to 300dpi the physical size of the image (kb) remains exactly the same, but when printed it will have 300 dots spread across an inch. The print size will be 1.67 X 1.25 inches – little better than a thumbnail.

3dpi/30dpiA comparison of 3dpi and 30 dpi in print
To Scale, but not actual size
Depending, of course, on your screen resolution (ppi)

Now let's take a look at video screens. Video screens only display pixels and are set to a screen resolution in ppi (Pixels Per Inch) a common setting today is, for instance 1920px X 1080px.
Any dpi information contained within an image is disregarded. An image with a pixel size of 500px X 375px will always display at 500px X 375px – on your monitor, on my monitor, or on Joe Blogs' monitor regardless of the dpi settings. It will never change either its pixel size, or its appearance. The physically displayed size will depend on your monitor's ppi settings.

Here's Proof That Video Systems don't use dpi
Don't believe me? Then take a closer look at the two images below. The first is set to 3dpi, the second is set to 300dpi. Both are 500px X 375px.
Do you see any difference? I don't. And yes, I have my glasses on.


Bike 3dpi
 Image set to 3dpi 

Bike at 300dpi
 Image set to 300dpi 

Still don't believe me? Then drag the images to your desktop (or right-click and save.)
Don't use the clipboard function. The copy function won't copy any dpi information and Windows image editors will automatically set the resolution to 96dpi, whilst Mac editors will set the resolution to 72dpi.
Now open both images in your favourite editor and check the size and resolution for yourself.

Believe me now?

It is important not to confuse PPI with DPI.
If you set an image to a physical size of 300ppi x 200ppi (px), but set your webpage to display the image at 500ppi x 300ppi (px), the browser will need to interpolate the image (i.e. replace the missing pixels with iterated (guessed) pixels, causing the image to look pixelated. If the same image is set to display at 200ppi x 150ppi (px) the browser will have to 'throw away' the excessive pixels – causing an an image to appear unsharp.

In the end, it's all just pixels.

blog comments powered by Disqus
  • Stacks Image 35399
  • Stacks Image 35402
  • Stacks Image 35405
  • Stacks Image 35408
  • Stacks Image 35411
  • Stacks Image 35414
  • Stacks Image 35417
  • Stacks Image 35420
  • Stacks Image 35423
  • Stacks Image 35426
  • Stacks Image 35429
  • Stacks Image 35432
  • Stacks Image 35435
  • Stacks Image 35438
  • Stacks Image 35441
  • Stacks Image 35444
  • Stacks Image 35447
  • Stacks Image 35450
  • Stacks Image 35453
  • Stacks Image 35456
  • Stacks Image 35459
  • Stacks Image 35462
  • Stacks Image 35465
  • Stacks Image 35468
  • Stacks Image 35471
  • weaverthemes
  • Stacks Image 35477
  • Stacks Image 35480
  • Stacks Image 35483

Links to the developers ® All trademarks cited on this page are the property of their respective owners.

x

Don’t miss a post!
Sign up for our monthly newsletter.

A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.

* indicates required

Contact Information

My Image

rjh web design

265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
Thailand 58130

About Us

We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.

Legal

This site uses Cookies to determine the best method of display in combination with your browser.
We do not harvest or sell personal information.
© rjh web design 2010—16

This website was built with loving care on a Mac using Foundation. For more information, contact me.