header left image   header right image

Home > Publishing Help > Creating Pages > Loading Images Faster

Loading Images Faster

Large images, whether physically or file size-wise, will load slowly, and web users on a modem line may get frustrated and leave your site. Here are some easy instructions on how to make a large image load faster using slices. Using Adobe ImageReady, you will cut your large image into additional, smaller images, which you will later put back together in the web page using a table. Here's the steps:

1. If you don't already have it, download the latest version of Photoshop from the Applications Server. Photoshop will have ImageReady bundled with it. ImageReady is the software you will use for the slices.

2. Open ImageReady.

3. In ImageReady, click on File > Open and open your large image.

4. Click on View > Create Guides (show me)

5. The guides are lines that will be drawn where your image will be sliced into additional, smaller images. Try not to make too many slices, as for each slice that you make, you will then have at least two more images. For most images, creating 2 slices in the horizontal and vertical direction will be plenty.

6. Click on Slices > Create Slices from Guides. You'll notice each slice now is individually numbered. (show me)

7. File > Save Optimized As. Choose where you want to save your slices.

8. Go to the directory where you saved your slices. You'll now see many images with the original file name but also with numbers after them. (show me)

9. To put these back together in your web page, you will want to create a table, with the same number of rows and columns as you created in your sliced image.

10. In the table tag (<table>), set the cellspacing and cellpadding to 0. (show me)

11. Place the images in the table cells and make sure the table cells fit the images tightly. (show me)

 

[Toolkit]   [ Publishing Help]   [Publisher Forum]   [Web Policies]  [Web Security]   [Brown Home]   [CIS Home]   [Home]


Page Last Modified: Tuesday, 23-Mar-2004 15:46:55 EST by CIS