[html] What is a good alternative to using an image map generator?

I have a large image and I want to make certain sections of the image clickable. I also want to specify the shape of the clickable area (square, circle, custom). Without relying on Javascript, how can I use CSS and HTML to create an interactive image-map? With hoverable "hot spots" and highlighting areas without relying on generating SVG coordinates. All of the online image map generators I found using Google, did not deliver what I perceive as a standard basic function of any imagemap tool.

This question is related to html imagemap

The answer is


This one is in my opinion the best one for online (offline however dreamweaver is best): http://www.maschek.hu/imagemap/imgmap


GIMP ( Graphic Image Manipulation Program) does a pretty good job... http://www.makeuseof.com/tag/create-image-map-gimp/


you can use online tool like online Image Map


There is also Mappa - http://mappatool.com/.

It only supports polygons, but they are definitely the hardest parts :)


This service is the best in online image map editing I found so far : http://www.image-maps.com/

... but it is in fact a bit weak and I personnaly don't use it anymore. I switched to GIMP and it is indeed pretty good.

The answer from mobius is not wrong but in some cases you must use imagemaps even if it seems a bit old and rusty. For instance, in a newsletter, where you can't use HTML/CSS to do what you want.


I have found Adobe Dreamweaver to be quite good at that. However, it's not free.


Questions with html tag:

Embed ruby within URL : Middleman Blog Please help me convert this script to a simple image slider Generating a list of pages (not posts) without the index file Why there is this "clear" class before footer? Is it possible to change the content HTML5 alert messages? Getting all files in directory with ajax DevTools failed to load SourceMap: Could not load content for chrome-extension How to set width of mat-table column in angular? How to open a link in new tab using angular? ERROR Error: Uncaught (in promise), Cannot match any routes. URL Segment Angular 6: saving data to local storage Vue.js get selected option on @change Bootstrap 4 multiselect dropdown How to add bootstrap in angular 6 project? Angular 5 Button Submit On Enter Key Press Angular 5, HTML, boolean on checkbox is checked How to render string with html tags in Angular 4+? bootstrap 4 file input doesn't show the file name How can I execute a python script from an html button? Bootstrap 4: responsive sidebar menu to top navbar Stylesheet not loaded because of MIME-type Force flex item to span full row width Failed to load resource: the server responded with a status of 404 (Not Found) css Change arrow colors in Bootstraps carousel Bootstrap 4 Dropdown Menu not working? CSS Grid Layout not working in IE11 even with prefixes How to prevent page from reloading after form submit - JQuery Centering in CSS Grid Detecting real time window size changes in Angular 4 Angular 4 img src is not found (change) vs (ngModelChange) in angular Bootstrap 4: Multilevel Dropdown Inside Navigation Align the form to the center in Bootstrap 4 How to style a clicked button in CSS How do I change the font color in an html table? Redirecting to a page after submitting form in HTML Load json from local file with http.get() in angular 2 display: flex not working on Internet Explorer Scroll to element on click in Angular 4 How to extract svg as file from web page force css grid container to fill full screen of device How does the "position: sticky;" property work? HTML5 Video autoplay on iPhone Disable button in angular with two conditions? CSS hide scroll bar, but have element scrollable CSS grid wrapping How to load image (and other assets) in Angular an project? Flask - Calling python function on button OnClick event How can I make Bootstrap 4 columns all the same height? Wrapping a react-router Link in an html button

Questions with imagemap tag:

Create a map with clickable provinces/states using SVG, HTML/CSS, ImageMap What is a good alternative to using an image map generator? Responsive image map Using JQuery hover with HTML image map