Writing text on web pages is easy. Creating maps – drawings or diagrams with links to other pages – requires more effort.
The current standard way of creating maps (HTML5, onwards) is with Scalable Vector Graphcs (SVG). There are free (and/or open source tools that can help with this.
A popular open source SVG editor is Inkscape. From this, you can create SVG from scratch, and then edit. This has the advantage of power … and the disadvantage of sufficient options to confuse the novice.
An easier path is to start off with LibreOffice Draw, that more simply draws shapes and enables positioning of text. One the map has been created, there’s the option to …
- Export as SVG (which could then be embedded into a web-oriented HTML document, or further edited in Inkscape); or
- Export as WMF, PDF or other options, to be used in a page-oriented document…
- The implementation at app.diagrams.net will save files to Google Drive, or download to your local workstation.
- An example of its use is 2016 appears at http://coevolving.com/aalto/201602-st2-muo-e8004/201602-st2-map00-systemsapproach.svg … within the suite of content indexed from http://coevolving.com/aalto/201602-st2-muo-e8004/201602-index.html .
A prior open source technology that is no longer under active development is the Visual Understanding Environment (VUE) from Tufts University.
- An example of its use in 2011 is at http://coevolving.com/aalto/201102-cs0005/201102-cs0005-map00-context.html , indexed from the course content at http://coevolving.com/aalto/201102-cs0005/-index.html .
- A major limitation of VUE is that, while it creates HTML, the text within objects is rendered as bitmap graphics.
There is a variety of other ways to create pages with SVG content. For a person used to coding HTML, there’s a small learning curve to do so.
[I can edit! Benjamin…]