The Boston Diaries

The ongoing saga of a programmer who doesn't live in Boston, nor does he even like Boston, but yet named his weblog/journal “The Boston Diaries.”

Go figure.

Thursday, January 17, 2002

Notes on a browser history mechanism

In my usual wanderings of the web, I came across an article on Xanadu (the article is long, but informative). For some reason as I'm reading, I'm thinking about the way current web browsers implement their history mechanism and just how bad it is—it's linear, which is the antithesis of hypertext.

Sure, a browser like Mozilla or Internet Explorer will keep track of all pages viewed, but the actual history mechanism, used by the ubiquitious “BACK” button, is horrid. Start the browser, browse five pages, A, B, C, D, E and then go back two to C, then view X. There's no real easy way to get back to pages D and E without knowing what pages they were, and if you weren't paying enough attention to where they were, you could spend the next hour or so trying to find them in the global history list. So I thought, wouldn't it be interesting to do a graphical representation of your browsing session?

The history session would start when you launch the browser and hit your first page.

[Figure 1]

[In the illustrations, text presented in a light yellow box is similar to the Tool Tips you'll see under Internet Explorer or Mozilla when you place the mouse over a link or image. If the text is in a light blue box, it's just a comment relating to the node it's near.]

As you browse pages, new nodes are added, in a linear list building downward:

[Figure 2]

The current node is marked (currently, with a large black dot) and the arrows point to the page you visited. Notice how they all point downwards from the first page (at the top) to the current page (at the bottom). The “BACK” button takes you to the previous node:

[Figure 3]

Or you can select a node to go back to with the mouse:

[Figure 4]

Hitting the “FORWARD” button will take you forward one page:

[Figure 5]

Okay, nothing too out of the ordinary and so far pretty straightforward. But, going back to the middle node there:

[Figure 6]

It's only when you start to follow a new path do things start changing. The old path you followed will swing out of the way, and the current path you are following will then continue on downward.

[Figure 7]

Which leads to another convention I'm using: the vertical path is always the current path, and the one that the “BACK” and “FORWARD” buttons on the browser will follow. Go back twice from the current node (labeled http://www.cse.fau.edu/~borko/resume.html) and then forward twice, and you'll end right back up to the same node. And, if you go back and follow a different path:

the previous paths with swing around, and the current path will start building downward again.

The current path doesn't have to always build downward. The current path could be color coded so the paths don't have to swing around when you take a fork. Another variation could be the current node is always in the center. Other refinements could be pages on a path that are on the same site could be grouped some way (background color?) such that you could collapse all pages on that site to a single node (to reduce clutter).

There are also some problems this method presents (that I'll leave as an exercise for the reader) but I think I would like to see some browser implement this as a history mechanism.

Obligatory Picture

[It's the most wonderful time of the year!]

Obligatory Links

Obligatory Miscellaneous

You have my permission to link freely to any entry here. Go ahead, I won't bite. I promise.

The dates are the permanent links to that day's entries (or entry, if there is only one entry). The titles are the permanent links to that entry only. The format for the links are simple: Start with the base link for this site: http://boston.conman.org/, then add the date you are interested in, say 2000/08/01, so that would make the final URL:

http://boston.conman.org/2000/08/01

You can also specify the entire month by leaving off the day portion. You can even select an arbitrary portion of time.

You may also note subtle shading of the links and that's intentional: the “closer” the link is (relative to the page) the “brighter” it appears. It's an experiment in using color shading to denote the distance a link is from here. If you don't notice it, don't worry; it's not all that important.

It is assumed that every brand name, slogan, corporate name, symbol, design element, et cetera mentioned in these pages is a protected and/or trademarked entity, the sole property of its owner(s), and acknowledgement of this status is implied.

Copyright © 1999-2019 by Sean Conner. All Rights Reserved.