Why a New Design?
By Van Boughner
I proposed some sweeping changes to the BAOC web site in January 2004. Visually, you probably found most the noticable the changes to the the new navigation system and color scheme. Behind the scenes, however, I also worked hard to modernize the site and make it easier to maintain (more on that below).
I realize that people get attached to the look of a website (I know I do), and I didn't want to leave people out of the process, so I conducted a two-week feedback period during which I could address concerns or incorporate new ideas from club members before switching over from the old design (on the left) to the new look (what you see in this page).
What To Look For in Site Design
A good first impression is important, and the look of a web site sets the tone for a visitor's experience. The top-level page should contain links to the most useful information available and create a good jumping off point for a search. You'd like new visitors to stay a while, and hope that something will capture their interest, or if they are looking for something in particular, you hope that they will find it easily.
The look of the top-level page should be carried into every page on the site. This makes it easy to recognize that you are still within the website. The navigation system should be consistent across the entire site, make it easy to move around within the site, and give you an idea where you are right now.
New Features in this Design
- Color Scheme
The background colors are lighter and paler shades, using two colors, green and brown, to differentiate between the navigation and content areas. Lighter colors provide better readability for the dark brown text. Link colors are green for unvisited links and a pale green-gray-blue for links that have already been visited. - Banner
A new banner complements the color scheme, bringing in a new font and incorporating the traditional orienteering bag image behind the O in the club name. This allows the use of orange and white in the banner without coming on too strongly.
- Search Box
The box in the upper right corner allows you to use Google's excellent search engine to look for anything on the site that you might have trouble finding otherwise. If you put your own name in there, for example, you can get a page full of links to all the BAOC events you've ever attended. - Navigation menu
On the left side of every page, this menu helps you understand where you are and where you can go. The current area of the website you are visiting will always be marked by the large orienteering bag icon. - Content Area
In center stage, the content area, with the light brown background, contains everything of specific interest in a page, changing with each page you visit. The format of items in this part of the page may vary greatly. - Stripes
A few additional cosmetic changes, such as the BAOC team color stripes at the bottom right hand corner of the content area, round out the design. They need not be the last cosmetic changes ever made, because this design will be easy to evolve (see Cascading Style Sheets and Templates below). - Standards
The implementation of the new design complies with the latest web design standards for XHTML 1.0 and Cascading Style Sheets from the World Wide Web Consortium (http://w3.org/). The logos at the bottom right signify this compliance. Using XHTML 1.0 helps insure a consistent look within different web browsers and prepares this website for future browsers.
- Cascading Style Sheets
The benefits of using Cascading Style Sheets are two-fold: 1) one or two files define the look of all pages, i.e. one change updates the look of the site everywhere at once, and 2) the size of the files on the site are reduced by about half, making the textual part of each page download faster (it doesn't do anything for the download times of the images, however). - Templates
You may have noticed that the filenames of new pages end with.phpinstead of.html. Files whose names end in.phpare custom-assembled by the web server right when you ask for them. This is, incidentally, how you get different images every time you visit the home page. The web server puts together the page from standard template files (for header, menu, and footer sections). This allows the webmaster to make corrections to anything in these outer sections in just one place, without having to change every file on the site. This will make it much simpler in the future to change or add to the design.
How to Help
People react to colors and navigation systems in a variety of ways. I'd like to know how you react. Please send your feedback on the design to 
. Tell me how it makes you feel. Do you like what's in the navigation menu? Is there something missing from the menu that you need often?
If you are confused by anything, let me know. If the design isn't easy to understand, it needs to be fixed.
Update May 2005
The look of the web site remains the same, but we are slowly converting all of the pages to use a wiki. This will allow for easier editing of the web site by any club member, right from the browser.