• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 4. Creating Web Images > Creating Low Resolution Images

Creating Low Resolution Images

If you have a lot of large images on your page, you can make life more pleasant for your visitor by creating a low resolution image that the browser can show immediately while it takes its time loading the higher resolution image.

To create a low resolution version of your image:

1.
Open your image in Photoshop, or other image editing program.

2.
Choose Image > Image Size (Figure 4.64).

Figure 4.64. Choose Image > Image Size.


3.
Check Constrain Proportions and Resample Image at the bottom of the Image Size dialog box. (Figure 4.65).

Figure 4.65. Here you can see the original size and dimensions of the image we're going to create a low resolution version of.


4.
Change the value of Resolution to 18 dpi and click OK (Figure 4.66).

Figure 4.66. With Constrain Proportions and Resample Image checked at the bottom of the dialog box, change the Resolution to 18. Notice that the file size shrinks to 39K but that the print dimensions remain the same.


5.
Choose File > Save As and give the low resolution image a new name.

6.
Click Save.

Tip

There is no difference between creating a low resolution image and changing the size of the image using the Width and Height fields (see page 63). Changing an image's size by changing its resolution is just an easy way to reduce it evenly to half or a quarter of its original size.


Tip

When you insert a low resolution image on your page, you must use the WIDTH and HEIGHT attributes to specify the dimensions of the original image or else both the versions will appear in miniature. For more details, see page 87.


  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint