How To Build A Classroom Website Using Microsoft FrontPage
Resizing Images
Table of Contents | Previous | Next
 
     
Step 1 - Insert an Image 
  1. Select or open the default.htm page.
  2. Place your cursor in the middle of the page and click Insert > Picture > From File ...
  3. Select the brown.jpg file and click OK.
  4. Save the page
Step 2 - Resizing the Image
  1. Click once on the image to select it (black handles appear)
  2. Click the black handle on the right bottom corner of the image and drag left and up diagonally to make the image smaller
  3. In the Pictures toolbar located at the bottom of the work area, click on the Resample button (this changes the file size of the picture to match the current display for faster downloading)
  4. Save the file -- the Save Embedded Files dialog box appears -- check the following:
    1. Make sure the Folder path is correct
    2. Set the Action: you can choose to overwrite the original file, which is what reduces the file size, or just have the new image reference the original file when it is displayed, which will not improve download performance.
    3. For this exercise, change the file name to brown2.jpg and hit OK
  5. Preview your page

Step 3 - Auto Thumbnail

  1. Click the Normal tab to return to work on default.htm
  2. Set your cursor a few spaces below the image and click Insert > Picture > From File ...
  3. Click once on the brown.jpg file to select it
  4. This time click the Auto Thumbnail button in the Pictures toolbar and observe the change
  5. Save the file -- the Save Embedded Files dialog box appears -- observe that a new file name has been automatically created
  6. Click OK to save the new image file and the default.htm file

NOTE: this will create a new smaller file in addition to the original file. You must upload both files. Download speed will be improved because the first file that is downloaded on opening is the smaller thumbnail picture. The larger picture can be viewed by clicking on the thumbnail picture.

Step 4 - Preview the Page

  1. Quick preview - click on the Preview tab OR
  2. Browser preview - click the  button on the toolbar or File > Preview in Browser ...