Mindmapping with XHTML-valid imagemaps

For self-study and Surgical Neurology International I would like to have webbased mindmaps. I did experiment with the Flash-export (example 1, example 2) that is available in MindManager 8, but it has some disadvantages: large filesize, Flash player required (which causes issues on smartphones and tablets), and several drawbacks from a usability standpoint. Conclusion: that’s not going to work for me and my purposes.

In my previous blog post I explained that nowadays I prefer to work with MindNode to create my mindmaps, in particular on my iPad. There is one problem, however: I can either export to a text-based HTML version with working hyperlinks, or to a graphical version (PNG image) without working hyperlinks. But I want both!

Nice hyperlinks, but now they don't work...

Sure, I can create a PDF on the desktop, in which hyperlinks are working. But that’s not a good web solution…. So I started looking on the web whether a good old imagemap may do the trick. To my surprise several webpages were mentioning several CSS solutions, thereby suggesting that imagemaps are obsolete. Not really, as I understand (for inspiration, see this post on Stack Overflow).

So I started experimenting with imagemap code, applied on a mindmap I created in MindNode Pro (for the hyperlinks in the map itself) and exported as PNG. After some initial errors reported by the W3C Validator it worked without problems. Click the image below for a simple example (source code can be viewed from the new window).

In this example, the hyperlinks DO work!

As you see, the document validates as XHTML 1.0 Strict, and the mindmap perfectly does its job. What you want to do with the hyperlinks depends on your goal: you can simply link to a website, but also have it open in a popup, or use JavaScript functions in another way (I have been playing around with JQuery for this purpose, which is rather nice).

Let me know what you think. Would you prefer the Flash examples I referred to, or the imagemap? And for what reasons?