Image resolution is one of the most common stumbling blocks for people who are just getting into digital pictures and placing those digital pictures on the Web or on their website. The resolution of the image itself is not the real issue but rather the its relation to monitors and monitor resolution. The size of an image can mean a lot of different things to different people. There is file size, resolution size, display size, print size and so on. Let’s see if we can clarify some of this.

 

Most digital pictures are comprised of dots, (well not really, they are actually just files of information that tells your computer how and what dots to light up). These dots are called pixels when referring to them on a computer monitor. Every computer monitor is made up of a bunch of tiny light bulbs or picture elements (pixels). If you have an image that is 400 by 500 pixels in size it will light up about 400 x 500 pixels or 200,000. This is normally expressed as 20K for Kilo or Thousand. Sounds like a lot… Modern cameras take pictures in the mega pixels. To get into the mega pixels you need a lot of area. A 6 mega (million) pixel image could be 3000 x 2000 pixels in size. An average computer monitor is tends to display between 72 and 96 pixels per inch. So if you have a 17inch monitor (about 16 inched from edge to edge) it would only show a small portion of a 6 Mega Pixel image 3000 pixels wide and 2000 pixels high. At full size it would display about 31 to 41 inches across!

 

A monitors resolution is determined by a number of factors. The good thing is a computer has the ability to scale images and display them at different resolutions. (It can squish or expand the number of pixels it displays per inch).

 

As a general rule of thumb most web designers will use 72 dots per inch as a web standard. They are assuming that most people will have their monitors set to view things that way. Keeping this in mind you can calculate image sizes for the Web based on this. If you want an image to fit on your blog page which is about the size of a standard piece of paper, say 8.5 inches across then you would need to make it less than 8.5 x 72 = 612 pixels in width. (Much smaller than a 6 Mega Pixel camera would give you straight up)

Remember dpi is not the same as pixel dimensions. Dpi is used for printing and technically does not have much to do with image size on the Web. When resizing images in your photo editing software divide the pixel width and height by 72 to give the approximate size in inches that people will view it at in their browsers.

 

If you need image editing software check out this article on a great free image editor.