User:Eleanorg/1.2/Forbidden Pixels/Html image map

wow, can you belive it's my first time using html image map! it is as if a wondrous vista has opened before me. or something. The trouble will be meaningfully associating it to the image itself - so that each area pops up either the string for embedding it, or shows the pixel as it is and where it's hosted. So I guess the map will need to be created anew alongside the image, in the same script - so that data put into the image file is also fed to the html map.

composing a relevant image map with python

simple image map

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <style type="text/css">
    </style>
  </head>
  
<body>

<img src="20by10PixelsSection1.png" alt="small image" usemap="#pixelMap" />
<map name="pixelMap">
  <area shape="rect" coords="0,0,1,1," alt="firstPixel" href="http://google.com" /> <!-- area covered: top left pixel? or 4 top left pixels? -->
</map>

</body>

</html>