Building an interactive clickable map for my blog (opens in new tab)

I too put my site's landing nav in an illustration: https://spenc.es

The SVG spec is huge and totally under-appreciated. There is plenty of it too that hasn't been implemented by browser vendors yet, like mesh gradients. There's even an animation language (that doesn't use CSS or JS) called SMIL that I didn't even know existed until about a week ago.

SVG though is super powerful and its full potential has yet to be realized. It is for graphics what HTML is for content, thus making layers, paths, groups, everything scriptable.

When I were a nipper, after walking uphill t'mill and uphill back home, after a full 26 hours of work in the evening I'd drag out the cardboard box with the soggy "modem" string and use an image map[1] for that there stuff.

Kids these days with their ess-vee-gee... Dunno they're born.

1: https://www.w3schools.com/html/html_images_imagemap.asp

Looks like the title has been changed to "Building an Interactive Blog Map", which better describes the fact that it's a "map" of the blog, not a map for the blog (which would make you think of something geography-related - at least I did).

Excellent that the links can be navigated to using the keyboard. But also sad that when the link text breaks over multiple lines the solution creates a link for each line.

Also (I may be wrong): it shouldn't be too hard to make the SVG more scaleable/responsive to get rid of the horizontal scrollbar at various screen widths? And the link text should be amenable to resizing in line with some CSS media query magic?

Nice. I went a little overboard with mine:

https://taoofmac.com/static/graph

I have been meaning to improve clustering and navigation, but haven't had time yet. Then again, it's 20 years' worth of entries, so there are multiple possible ways to do it.

Very cool! I had no idea Figma did some of that stuff, definitely need to check it out more. I have really appreciated some of the tools over the last 5-10 years allowing quick iteration on web stuff, I remember how tedious it used to be to have to copy, click around, edit properties and then paste hex codes in some design software.

SVG is also really interesting how powerful of a spec it can be, but boy oh boy, having to parse / render it can be an undertaking. I was trying to do some simple stuff once and lets just say I'm thankful there are smarter people out there than me who write rendering engines.

> Hey, here’s a wacky idea. What if a bunch of us made these kinds of blog maps and then somehow wired them up together so that you could kind of walk across the map?

we could even call this… a meta verse?

Really cool, but I think that if this kind of design wants to compete with the reverse chronological order homepage, there needs to be some way to create it automatically, based on tags or internal references, like a wordpress plugin.