Exporting Images

To create a jpeg for a web-ready image, you should export the image rather than saving it. In Photoshop use File->Save For Web and Devices.

Photoshop Saving For Web and Devices

Photoshop Saving For Web and Devices

(In Fireworks use File->Export.)

Exporting  jpegs between 80% quality and 60% quality in Photoshop will produce usable images. You are trying to find the correct compromise between image size and image quality. You may have to experiment with the quality settings to produce satisfactory images. If your jpeg images are larger than 250KB, then you are saving them with the quality settings too high. Usually web images are between 50KB and 220KB. If they are this size your image will load faster and will be less load on the server

Photoshop’s export screen makes experimenting with image quality easy.
Choose the quality settings in this right hand panel.

Choose Jpeg Quality

Choose Jpeg Quality

Photoshop will display your working photo (Original) and the Optimized image or let you compare images either 2 settings at a time (2-up) or 4 at a time (4-up). At the bottom of each image preview is displayed the image size and load time. (You can choose the connection speed, as needed).

Previews of Jpegs of Different Quality

Previews of Jpegs of Different Quality

Click on the image preview with the chosen quality setting then click “Save” to save the image on your computer.

Name the image sensibly. I advise you to name it with all lowercase and no white space, using a dash between words. Frequently I number images in the order that want them to appear on the web page, e.g. 01sculpture-name.jpg, 02another-sculpture-name.jpg, etc.

Knight Digital Media has a very good tutorial on exporting jpegs and the difference between “save as” and “save for web and devices”.

You do not need to create thumbnails, WordPress will do that for you.

Leave a Reply

Your email address will not be published. Required fields are marked *