Saving photos - Images for the web - Web Team - University of Canterbury - New Zealand

Saving photos

JPEG is the only file type for photos on the web.

You need to balance image quality and file size so photos still look good and the file size is as small as possible.

This process is called optimising. Compression is applied to photos, reducing the amount of information in the photo.

Keep an original of the image until you are sure you no longer need it as you can't add information back.

Instructions for saving images with few colours.

How to save a photo for the web

1. To save a jpg select File - Save for Web

2. Select the hand tool in the Save for Web box (this allows you to move the image). The original is viewed on the left. On the right is the image preview, showing how the photo will look using the current settings.
(NB Save for web automatically changes resolution to 72dpi)


3. Select JPEG (photos) from the drop down menu

4. Use either the compression drop-down menu or slider bar to select the lowest quality before the image quality markedly deteriorates. (The drop-down menu and slider bar do the same thing. It is individual preference as to what one you choose to use)

5. Leave all other settings on default


6. At the bottom of the Save for Web box you can compare the size of the original photo and the size of the preview photo using the current settings. Watch how the size and download time changes on the preview as the compression applied is altered

7. Once you satisfied with the balance between image quality and file size save the image to the graphics folder in your site by clicking 'ok'.

Tips for saving photos

  • Use lower case and hyphens-instead-of-spaces-in-filenames
  • Keep a copy of the original image until you are sure you no longer need it
  • If you think you may need it again archive it on your hard drive, p: drive, K: drive or burn to CD.
    Don't store originals (large files) in your website files