Organization

We have discussed the layout of individual pages as well as page and site navigation. Overall site organization is an equally important topic, especially once a site grows beyond a dozen or so pages. Site organization is important for both a page visitor as well as for the site designer.

The Visitor

A clearly organized site helps a visitor to find what they are looking for. When related pages are grouped together visitors can more easily find materials they are looking for. Visitos don't need to waste time wading through photos when they really want the diary if things are organized properly.

The Designer

Visitors never have to "see" how many files are in an individual directory, but as a designer you do, and when a directory becomes too large it becomes difficult to manage. Once a site becomes larger, it makes sense to break it into several subdirectories. These directories might correspond with the "logical sections" of the site itself. For example, an online newspaper might put the sports, weather, politics, and entertainment stories in different directories.

Modes of Organizing a Site

One can think of pages as nodes and links as the connections between nodes. In this section I would like to outline several methods for organizing a small web-site. The choice of organization should not be arbitrary; as far as a possible, the mode of navigation and organization should fit the content of the site.

The Linear Approach

Imagine a site consisting only of one document. Or, for that matter, let us have multiple documents such that each document leads to only one other document, yet never back to the original document. This is simply a totally linear approach to site layout. It is easy to navigate, since there are few choices - either you proceed, or you do not. This is one extreme of web page/site design, and is not particularly common, except for those sites consisting of only one page, such as certain personal home pages.

TheTree Approach

Many of us are familiar with directory trees from working in Windows, DOS, and other operating system environments. A tree is a mathematical object that takes its motivation from real trees. In a tree, there is a path from each component to every other component, and there is only one such path. This implies there are no "loops". For a technical approach to the subject, see Graph Theory by Béla Bollobás or Introductory Combinatorics by Richard A. Brualdi. Trees are examples of partially ordered sets. Trees set up a hierarchical relationship between files in a site, just as they do in directory trees. Trees provide only a slight deviation from a linear mode of thought. Consider footnotes, for example. Imagine if we had footnotes within footnotes within... This would be a tree structure. Notice that in such a tree structure, since the path one takes from one document to another is well defined, one can "back-track" with great ease. In other words, the tree structure maintains information well.

In terms of web-site layout, this is basically the "Table of Contents" approach. Notice that this is only a minor deviation from the Linear Approach. We also see that the linear approach is a simplifed tree layout.

The Cyclic Approach

If we take a string, it is linear, but if we tie its ends together we get a loop, which is cyclic. That is, if we start at a point and keep going "forward", we eventually end up where we began. The same is true with a cyclic approach to web-site layout. If you start on any page and simply follow the links, you are guaranteed to visit each page once and to end up back where you began. Although the cyclic approach is clearly not the same as either the linear or the tree appoaches, the deviation from linearity is actually quite minimal - after all, you still go from start to finish; you just start over again.

Complete Graphs

Imagine we have set of 5 beads and we connect each bead to each other bead with a string. In a tree we had to perhaps "visit" intermediary beads on our way from one bead to another, but here each bead is directly linked. This is an example of a complete graph. This approach is highly non-linear. All the previous methods basically defined the path one takes to get from one point to another. The only difference in the cyclic model is that one can take either of two directions. In this model, however, the path between two points is very ill-defined. There are many non-equal paths between two points, and as the number of beads, objects, etc. increases, the number of possible paths increases exponentially. In exchange for ease of navigation, formal structure is lost.

Let us relate this to the layout of pages on a web-site. Given a small enough site, connecting each and every page to all the other pages can be a simpe task, and relatively non-confusing. However, this becomes a mess when the number of pages included gets too large.

This Site

Now I would like to explain the model used in this site. Each chapter is in its own directory. Example pages are located within subdirectories, giving this site, overall, a tree-like structure. The navigation system, though, is a bit different. Each "chapter" has a table of content (continuing the tree-structure). The bottom navigation bar for each page allows one to go "forward" and "backward", as well as access the main table of contents, and the chapter table of contents.

Contents	Chapter 3	Previous	Next