I'm creating an HTML email using a large image with an image map, which has two rectangle areas specified:
<img src="newsletter_files/background.jpg" width="600" height="584" border="0" alt="39steps crimbo cards" usemap="#email">
<map name="email">
<area shape="rect" name="emailaddress" coords="212,305,350,290" href="mailto:[email protected]" alt="Email [email protected]" />
<area shape="rect" name="website" coords="585,485,465,550" href="http://www.domain.co.uk" target="_blank" alt="Domain link" />
</map>
Trouble is, only the second one works. The first one is ignored. I've Googled for solutions but not found anything.
I could cut the image up but that creates its own problems with testing etc - the email is very simple so for my purposes an image map is the best method.
Anybody had similar problems?
I don't about image maps in emails (mostly because I've never used them)
What I suggest is open the image in photoshop and use the slice tool. When you save you can save images and html. The html outputted will be perfect for emails.
A couple other things when it comes to html emails:
p tagsdisplay:block on your images (this prevents unwanted gaps between images on some email clients