Back to Homework Page

Controlling Color/Gifs/ImageMaps
This assignment is using color and images for the backgrounds of your pages, the color attributes in the BODY tag for your text and links, animated gifs and imagemaps.

Instructions

    Add the following elements to your Web site - Worth total 50 points:
  1. Add the color background attribute in the BODY tag. Use hex numbers (ie: bgcolor="#3300cc"). See example. Worth 5 points.
  2. Text/Link Colors. See example. Worth 10 points.
    1. Add text color attribute in the BODY tag. Do NOT use black. Pick some other color using the hex numbers (ie: text="#3300cc").
    2. Use non-default colors for your link and vlink attributes in the BODY tag. (This means use any color OTHER THAN the regular blue for unvisited links, green [Internet Explorer] and purple [Netscape] for visited links.) Use hex numbers (ie: link="#3300cc").
  3. Add a background image in the BODY tag (background="insert_image_name_with_right_path,_NO_SPACES"). See example. Worth 10 points.
  4. Add one ImageMap containing at least (3) hot spots. One rectangular, one circle and one polygon.
    List description, which page and where it is on the graphic. (ie: About Me page, photo with angry people, person with red nose, person with red ears and person with red toes.) The three hot spots MUST have three different URLs and/or email addresses. Worth 15 points.

    See example ImageMap and code.

    See tutorial and link to download Mapedit.

  5. Add one (1) animated gif.
    List description, which page and what it is. (ie: monkey, on Contact Me page, animated gif) See example. Worth 10 points.
    6.
  6. IMPORTANT: Email me your name, your section number and the (exact) URL to your site. Make sure to follow all of these instructions. I will only view this homework assignment via the Internet. Do not give me a disk.
Note: Day 8 in your text book (starting on page 211) covers animated and transparent gifs and some software instuctions. Day 9 covers ImageMaps.
More Help
For free animated gifs, animation software and tutorials go to, on our main Beg. HTML site: Resources Page.
A simple program in which you can make ImageMaps is called Mapedit for both Mac and PCs. It is available in the JC labs. Or you can go to http://www.boutell.com/mapedit to download it. It is free to try, $25 to buy

Other places to find Mapedit for free or a trial version are:
CNET Shareware. Type in Mapedit in the search field. Hit the go button. It takes you to a download page where you have choices.
zdnet.com/downloads. Type in Mapedit in the search field. Hit the go button. It takes you to a download page where you have choices.

For tutorials on ImageMaps and Mapedit go to: Tutorials ImageMap for Mapedit.

BACKGROUNDS: To see how to create backgrounds with color in Photoshop, go to: Horizontal Background Sample or Vertical Background Sample.
WARNING: If you leave off your name and/or section#, you will not get credit for this assignment.
EXTRA CREDIT
Worth 20 points. For those of you who want/need extra credit, here is your opportunity. Convert any graphic from any format to a .jpg or .gif. Its original format can include: .tif, .bmp, .pict, .targa, .eps or others but NOT originally .jpg (.jpeg) or .gif. When you email me this extra credit assignment, you must tell me:
  1. Which format it was in originally. (Remember, NOT originally a .jpg or .gif)
  2. Which format you made it into.(.jpg or .gif)
  3. The name or description of the graphic and which page it is located on on your site so I can find it.
  4. Which program you used to convert it.
    5.
Due by last day of class for full credit.
For continuing in Web classes in the CIS Department at the JC, go to:
List of classes. Scroll to the bottom of the page.

Back to Top of Page