Designing Personal Web Sites

Part II: Using Images and Animated GIFs

If Front Page is not open, begin Front Page, choose File, Open and then load index.html.

 
If you see an image somewhere on a web site that you like, and if the image is not copyrighted, you may copy the image for your own use. Please do not copy an image if the owner explicitly requests that you do not. To copy an image for your own use, follow these steps:

  1. To try this out, please use your browser to go to the URL: http://www.ravecentral.com/harrypotter.html and copy the image of the cover of the original soundtrack from the movie. Save it as harry.jpg ,(type jpeg), making sure to save it in the same folder on your a: or h: drive.

  2.  
     
     
  3. To use the image in your own web site, follow these instructions:

If you find a background that you like that is being used as the background on another web site, the same rules about copying apply as before. If the owner does not mind for you to copy the background, follow these instructions:

To use the background with one of your web pages,

  1. Let’s try it out. Go to this page:  http://www.cs.transy.edu/tgarrett/example.html   and save the ugly green background. Just right click anywhere on that ugly background and Save Background As.. Use the name ugly.jpg and make sure you are saving it to the correct folder on your a: or h: drive.

  2.    
     
  3. Now, following the previous instructions , use that ugly background for your "hobbies" pages. Now that you have done it, feel free to change it!

  4. Now select one of the cells of your table on your index page and use this background as the background for the cell. Move to the cell and choose Table/Properties/ Cell and then in the Background section, click on Use background picutre and then type in the file name (or browse to find it.) Remember that you must have something in the cell for the background to show up -- even if it is only a "space".


 
 A good place to go for backgrounds to choose from is : http://www.silkpursegraphics.com


To use an animated gif, follow the same procedures as for copying an image. To try it out, go to the URL:  http://members.aol.com/Genschman/animgif2.htm  . Place your mouse over the moving "under construction" gif and right click. Choose Save Image As.. and name it construct.gif .  Make sure it is saved to the correct folder.  
 

  1. Go to one of your pages and insert this image. Save and Preview.

  2.   .
  3. When you find a good site for downloading images, backgrounds, or animated gifs, please post its URL to our class’ discussion group on Blackboard..