Web Graphics

Image Size

Image size refers both to the height and width of the image in pixels and the file size. Large graphics take a long time to download over the Web and many people will become impatient. Try to keep your graphic files less than 35K in size, and remember that they add up if you have multiple images.

Assuming you are designing for an 800 x 600 resolution, make sure your largest graphics are no wider than 720 pixels wide. Images wider than that require scrolling on smaller monitors. Most graphics applications have commands that display the size of the image in pixels. For example, in Adobe PhotoShop choose Image Size from the Image menu to see the dimensions of an image.

The figure below is an example of an image that is too large to fit within a small browser window. The graphic is a GIF that is 900 pixels wide. It will stretch any table out to accommodate the large width, so the text in the same table runs off the page also. This is pretty annoying for users with lower resolution monitors or low vision. A big percentage of people will still have to scroll horizontally to see the entire image. (more and more people are viewing in higher resolution, but don't count on it).