HTML Image Maps
An image map turns regions of one image into separate links.
Add a usemap attribute to the <img>, then define the clickable regions with a <map> and one <area> per region.
An image map
<!DOCTYPE html>
<html>
<body>
<img src="shapes.png" alt="Shapes" usemap="#shapes" width="200" height="200">
<map name="shapes">
<area shape="circle" coords="75,75,40" href="/circle">
<area shape="rect" coords="130,10,190,60" href="/square">
</map>
</body>
</html>