Image Map Independent Project
In this project, you will create and configure an image map that has hot spots serving as links to other pages.
Create a project folder named imageMap_YourLastNameFirstName. Inside, you should have a subdirectory named images to hold your image(s); other subdirectories are up to you. Create the required Web page(s) using HTML5 standards and style them using a single external CSS file. Name these files appropriately.
CONTENT: Home/main page includes:
- A ‘caption’ for a photograph
- A photograph which will allow you to add a minimum of 4 hot spots
- Use Paint, or another image editing software program, to determine the appropriate coordinates for defining your hot spots.
- Each hot spot should take you to another page that gives more information about the area on the image map that was clicked. You can make these hot spots link to a local page or an external page. If you make them link to local pages, please create a very basic page for each.
- Each hot spot should give an appropriate tool tip when the mouse is hovering over it.
- A more complete description for the photograph.
STYLE: Your home page should look good and make use of some of the CSS properties we have been covering, including those introduced in this unit. If you use local pages for your hot spot targets, they are not required to have much content or style.
Grading Rubric:
REQUIRED ITEM | POSSIBLE POINTS | POINTS RECEIVED |
Folders and files named, located, and used appropriately; general comments included | 2 | |
Image map included, has at least 4 hot spots defined, each has a tool tip, and each works as expected. | 10 | |
CSS used to style home page in a pleasing manner. Include at least 12 CSS declarations. | 8 | |
HTML and CSS files validate. | Up to 10% deduction for one file not validating; up to 25% deduction if both files have validation issues. | |
Total project Possible Points: | 20 |