December 16, 2003

Image Maps Live

In the newest edition of A List Apart, Night of the Image Map, or, How to make image maps in CSS. The technique’s pretty simple once you sit down and think about it: use a large image on your page, and for each of the links, absolutely position an <a> in just the right spot. Use :hover and background-image to create rollover effects. Usually I don’t like relying so completely on absolute positioning, just because it can be wonky from browser to browser, but if it’s tested thoroughly and made accessible, which this one is by using well-known image replacement techniques, it can be made workable. Like all image replacement, it suffers when images are turned off in a CSS-compatible browser, but I don’t think anyone’s worked through that one yet.

Of course my own attempts at creating pretty graphics are so weak that I don’t like using them even in a small corner of the page. For me to design an entire page in Photoshop? Ain’t nobody would want to see that.

Filed under The Computer Vet Weblog

Comments (1)

Comments RSS - Trackback - Write Comment

  1. Anonymous says:


    Posted June 29, 2004 @ 8:11 pm

Write Comment