Image Map
An HTML technique that defines multiple clickable regions within a single image, each linking to a different destination.
An image map is an HTML technique that defines multiple clickable hotspots within a single image, each linked to a different URL. For example, a map of Japan where clicking each prefecture navigates to that region's page demonstrates interactive image-based navigation.
Implementation uses <map> and <area> HTML tags. The shape attribute on <area> defines rectangular (rect), circular (circle), or polygonal (poly) regions via coordinates. However, image maps work poorly with responsive design since coordinates break when image dimensions change, so CSS and SVG alternatives are now preferred.
When using image maps, setting alt text on each <area> element is mandatory for accessibility. For large images, applying the image compression tool maintains page load performance.