Open ImageReady 7.0. Now go to Window > Show Image Map. Open image you would like to map.
1.) Select the Image Map tool (you have choices here, rectangle, circle, etc.).
2.) Drag cursor over area to map on image.
3.) In the Image Map palette, Enter URL to page for Link. You may also add a Target and Alt tag if needed, see screen capture below.
Repeat Step 2 and 3 until all area's are mapped.
4.) Right-Click on image and go to Preview in > Your Browser. The browser will launch. Roll the curser over the mapped area's and notice in the bottom left of the browser how the links change. Notice under the image also that all the code has been written for you! Just copy and paste the code in between the "ImageReady" brackets to your page where you want the image to show. Be sure to upload image as well.
To Save image and code...Simply go to Save Optimized As.. (Be sure to
select "HTML and Image"). This will save the image and create
an html page with the code embedded in the file in which the code can
be extracted from at a later date.
--------------------------------------------------------------------------------
Creating a Layer-based image map
Prepare images to be mapped on separate layers in Photoshop first, then transfer image into ImageReady.
1.) In the Layers palette, select a layer from which to create an image map area.
2.) Choose Layer > New Layer Based Image Map Area.
3.) In the Image Map palette, Enter URL to page for Link.
Repeat Step 1 thru 3 until all area's are mapped.
4.) Repeat Step 4 above.
