File Size

Two attributes make up an image’s size: the dimensions (e.g., 100px X 25px) and resolution (e.g., 96 pixels/inch or 300 pixels/inch) of the image. Any combination of the two affects the image size.

The number of images and their size will increase the amount of time it takes a computer to display a Web page. For best results:

  • limit the amount of images per page
  • use a low image resolution (see “File Format” below)
  • decrease image dimensions (use thumbnails or other Web-friendly image standards)
  • notify the user if they are entering a Web page with many images that may slow down the load time

When it is absolutely necessary for a page to have many images (such as an insect or plant identification resource) we recommend the following (in addition to the above):

  • place images below any text on the page so the viewer can read the text while the images are loading
  • use recommended image dimensions and correct Web file formats (below) to create thumbnails. When a large image is necessary for identification or printing, make the thumbnail a link to the larger, higher resolution image.

Do not place a high-resolution image with large dimensions into your Web page and “re-size” it with the WYSIWYG editor (What You See Is What You Get). This gives the appearance that it is a “small” image, but the actual file is large and the page will load slowly.

Instead, open the original in a photo editor and make the appropriate file conversions, then re-save the smaller file for the Web.

For more information on image dimensions specific to PSA/CAFLS templates, check out "My images go out of the page's layout boundaries"



Page maintained by: Walker Massey, emassey@clemson.edu