Tinderbox Forum

Call for Website map examples

Does anyone have an example of how they have constructed a website map and could show it to us?

I am a forever novice (at TBX and website design) and I am mapping my website in a way that feels clumsy. Rather than inventing the wheel, I am sure there are much more inspiring maps out there. I don’t want to run my website from TXB. I want to just keep a record of URL’s and links, prepare documents to be loaded later… I feel disorganized and I think a map, even as I am creating the site would help organize me.

I’d suggest call this a plan or conceptual map of your Web site.

As I understand you, you’re looking for a way to use Tinderbox to help understand and plan your site; is that correct? (People also talk about site maps in terms of charting a fixed site that already exists, much as a roadmap shows roads that exist without regard to what one might like to have.)

Maybe not exactly what you want but it replicates a map to a website… Notes in the home page

Yes, Mark B is describing it. Thanks.
I have a feeling that the process of organizing a website is also a discovery process. So, my tinderbox map looks disorganized to me, because the website is also disorganized. I have to tinker at both conceptual map and the actual website and increase the order as an organic process.
Every time I go through this process with TBX, I get lost in the bells and whistles. Maybe I am better off just keeping it as simple as possible since the problem is a lack of my desired order.

@ellen if you don’t mind, I made a little video demonstrating one approach to getting started with mapping out a website. In this case, I worked with your site.

I placed your site in a browser next to a Tinderbox document. I started by dragging in page links** from the site’s menu bar. Each link becomes a note, with the URL of that link automatically added to the $URL attribute for that page. You could add notes about the page to the $Text for that note.

The rest of the short video depicts how a blog article linked off your main menu can be indicated on your Tinderbox map, and you could create a link in Tinderbox named Article to show the relationship. That blog article is also linked off a different main menu. So I created a different Tinderbox link named Change Article? to flag a possible redesign option to change the navigation leading to that article.

None of the demo is meant to critique or suggest what you should do with your website – it’s just a video to show one way to get started with a Tinderbox document that lets you take notes about your site, and then begin to play with the bits and pieces of your site and think about how to evolve its design and navigation. You could use note shapes, colors, link colors, adornments – in other words a few or a lot of Tinderbox’s styling features – to begin to develop one approach to website mapping and design/redesign.


** you’ll notice that dragging a link out of Safari sometimes takes a bit of fine motor skill!


It’s generous of @PaulWalters to produce this video.

I, for one, hadn’t realized that you could just drag links from a web page over to a map view (or, I see, also outline view) to create a note, with the link info. Live and learn!

When I started to do researches for my website and resolved myself to choose a website builder, I drew a map like this one and built my site step by step. In this way, I was able to visualize what were my needs in terms of sections, subsections, pages, and so on.

1 Like

Did you decide to use something other than Tinderbox as the website builder? If so, why?

My intention was not to use Tinderbox and export a website from it. I only designed the general shape of the site using the map view. But, I remember that there was a tool whose the name was written in green. I forgot its name. It was designed to build websites if I remember correctly.