Resolution of Pictures for the Web


The web "standard" for picture resolution is 72 pixels/inch. But does this really matter in most browsers?

No.

The pair of pictures below are both 400 pixels wide by 265 pixels high. However the one shown on the left has 300 pixel/inch resolution, while the one show on the right is the web "standard" of 72 pixels/inch.

 
This picture has 300 pixels/inch resolution.   This picture has 72 pixels/inch resolution
Photos © 2001 William R Schneider    

You can see that your web browser is ignoring the resolution tag in the file. It displays the pictures so that each pixel of the picture is being displayed on one pixel of your monitor, effectively ignoring resolution numbers. You're getting the "100% view" that you see in Photoshop when you are editing the picture.

I'll leave it to the curious student to ponder why the resolution of web pictures is said to be 72 pixels/inch. (Hint: The resolution of computer monitors for many years was 72 pixels/inch. This fact alone won't explain it, but it will get you thinking in the right direction. )

On another note, many browsers will slightly downsize very large images so that they fit the viewing window of the browser. However, it does not utilize resolution data. It's not smart to rely on automated downsizing and just use large pictures because your internet connection must deliver the full-sized large picture first, then it gets cut down on the computer to be displayed. This slows down the browsing experience because of bandwidth issues, and you won't see the extra pixels anyway.

Last but not least, if you download both files above to your computer and print them, THEN the resolution will matter. One will print very small but have high quality, and the other (72 ppi) will print about the size you see it here but will show the "jaggies". Both files contain the same data however.

[back]