Image Maps
 

Image Maps are extremely useful when you need to create a handful of links like navigational or icon Links for your site.  (NOTE: You still need a text link on your web site for those that choose to surf the web with graphics turned off!)

For our image map you'll need a graphic.  I'm going to make a graphic image in PSP 7, using the main navigational *links* you see on the left.  So My image map with have the links for Web Basics, FrontPage Tuts, PSP 7 Tuts, Links and Feedback.

For this very simple working image Map below

I used the following settings:

1. File, new

2. 120 x240,

3. transparent.

4. OK

5. I selected Preset Shapes and choose the rounded rectangle.

6. I checked antialias,

7. I checked Create as Vector

8. Line Size 3

9. Added my text

10. Saved as gif and named image.

By applying effects such as gradients or buttonsizing, or drop shadows you can create just about any image you want.

For This graphic I just applied a gradient with the feathering of 8.. What a difference

Image maps can be useful and enhance your web site design. Test the maps above and to see how a image map works.  Just remember to keep the file size as small as possible.  Also you can use any image you choose, a picture, or graphic you already have.  Play around with this and have fun using image maps in your web design.

To format an image map *add the Links* in FrontPage, go to Lesson 14.

You have completed this Tut.

Back to Top

Back | Home