I’ve found a new and an easier way to image map without having to do all that coding and cutting stuff in photoshop, and it stays as one picture!
1)First, you will need to go to this site.
2)Upload your image or directly link to it.
3)When it’s done uploading it will take you to this page. Press continue.
4)After you press continue, it will take you to this page. This is the map editing area page.
5) We are first going to map the middle link where it says “ayevanity.com” with a regular rectangle. Click the rectangle button and it will bring up a box on your image map. All you have to do here is change the link url/alt and move the rectangle to where you want the link to be.
6)Press “save” and it will look like this.
7)Now, we are going to do the “content” area on the map. As you can see, “content” is kinda circular with an odd shape. So for this we are going to use the “custom shape” button.
8)Make a selection by clicking on the outside of the soon-to-be link. You can see this in the image below. (Green dots around “content”). Then, when you are making a box around it, go down to the options and change the link url/alt and press save.
9)Do this for the rest of your links and press “Get your code” under the “Finished” tab on the sidebar. It will then take you to the next page; at the top of the next page there is a navigation, click “Html output” to preview your image map to make sure it’s the way you want it, then press “html code” to finally get your code.
10)Copy and paste this code into your open web document and it should look and work like the one at the top of this page.