Image Resolution Irrelevant for Web Display
I often see tutorials on the web about proper image resizing for the web, I actually found a few when looking for info related to my previous post on image compression. All of these tutorials preach the ’72 ppi’ mantra saying that computer monitors can’t display more than 72 ppi so setting this higher creates bigger images and is wasteful. I’m not sure where this all started, but it’s nonsense. This page has some useful info and worth a read for another explanation. What I’ll demonstrate here is how this setting has absolutely no influence on images displayed in your browser. This ppi (pixels per inch) setting only matters when you print your images.
When displaying images online, think in terms of pixels and forget about ppi.
This is the image I chose to work with, already exported and visible on my site. It has image dimensions 1920×1366 and a file size of 112 KB. I’m going to resize this image twice with two different image resolutions.
First, using these settings in photosho. Notice the 72 ppi, the ‘industry standard’ and ‘correct’ way of doing things. Anything more or less would just be wrong.
The resize options create a file that is 55 KB in size and looks like this:
Now you can say that WordPress is changing the dimensions, etc. If you think I’m doing something odd here just look at the file on it’s own in your browser window: link to image.
Now I’m going to resize the original image again, this time with a different setting for ppi but the same image dimensions.
7200 ppi? You can’t do that! It will create a huge image and take forever to download for my users. It won’t look right in my browser. This goes against everything I have learned. Well, the options above create an image that is also 55 KB in size and looks like this:
Again, if you think WordPress is doing something odd feel free to view the image directly: image link.
As you can see, the ppi setting in the image resize dialog is irrelevant for web display. It doesn’t change your file size or how the image is displayed in the browser. I urge you to try this yourself and help end this 72 ppi myth that is so prevalent on the internet.
