ImageMap CSS Exercise

Objective / Final Product

Using an image and CSS together to make a non-static navigation tool that is controlled by a CSS file.

Programs

• • Dreamweaver

  • Web Browser

Filenames

• • NavProjectFiles.zip (found on the "Handout" network drive)

Steps

• 1. Create a new folder called IMAGEMAPCSS

  2. Download and unzip NavProjectFiles.zip into the folder you just created.

  3. Use Dreamweaver to link the web pages to their respective stylesheets.

  4. Investigate online at least three techniques as to how CSS can be used in conjuction with an imagemap to create an interesting creative navigation tool for a website.

  5. Choose the option you wish to try to imitate from the three you've investigated.

  6. Apply this technique to the files saved above.

  7. Add the necessary coding to the various webpages and the appropriate stylesheets.

  8. Modify the stylesheet to make the site look unique.

Duration

• • Approximately 1 period

Evaluation

• • Thinking / Inquiry / 5