Enter Members Area

Menu

Site Design

This website is based on James Koster's 'Plain-V01' design downloaded from the Open Source Web Design site.

The selection of this particlar design arose from out of an informal round of discussion at one of the Society meetings. Everyone present thought that our existing website, was looking tired, in dire need of a makeover, if not a complete rewrite. We asked everyone to throw their needs and wants into the pot, so that we had a firm jumping-off point for the task ahead. Requirements were captured on a set of flipcharts and we started from there.

The general feeling was for a site that reflected current trends in web design. Most amateur astronomy websites feature light text on dark backgrounds, and (not surprisingly) most of our members preferred it the other way around.

Not being a professional web designer by trade (or inclination), I started by looking at the templates on the Open Source Web Design site, as we wanted something free, and something that we could start to use right away. Most of the templates didn't fit the brief as closely as I wanted until I discovered James' Plain-V01.

This particular design ticked all the requirement boxes. To my mind (although more importantly to our members) it looks modern, features a clean and uncluttered organisation of the major elements, uses a 'standard' four section UI model (header, LH content, RH navigation, and footer), and could be easily modified and extended to suit our requirements. In particular, there was a spooky poetic resonance between James' stated objective of designing a template exploiting the concept of 'whitespace', and our own use of the word 'space'; the 'space' on the webpage echoing the space between the stars.

The fonts were exactly what we wanted - sans-serif; clean, simple and easy to read.

As things turned out, the 'complete rewrite' never happened, instead we ended up pretty much just realigning the existing website.

Sizings were changed from pixels to em's; consequently each page resizes itself in response to changes to browser window size, (so-called liquid/fluid design).

We dispensed with the top menubar, replacing it with a site search feature and moved the Login from the RH navigation into this top section.

Some members didn't like the original green color and after some experimentation I settled on a light brown, sand/gold colour, which harmonised better with the shade used for links and the standard purple for visited links.

The remainder of the modifications we made were purely to support the intended content. We expanded the LH content DIVs to allow for images to be aligned left or right, (introducing an element of variety in presentation), and for a multi-column content display.

Various ideas from other sites were incorporated, primarily from various posts to the A List Apart website - a site that offers many thought-provoking ideas and is well-worth visiting for all web designers.

Quite a few of the CSS and HTML markup and style practices posted in SimpleQuiz were used; the main one being the styling of images and captions.

The use of dropcaps and raised caps was inspired by Mandarin Design.

Active Content - Javascript

In common with many other websites we use Javascript routines to deliver dynamic content. Some browsers (IE, for example), will warn you that 'active content' has been detected and prompt you for whether or not you wish to allow the active content to run. Our Javascript routines do the following:

Accessability

One of our aims for the realigning of the site is to make all web pages accessable to all, and conform to current 'best practice' for web accessability. To this end, whilst we were designing and creating this site, we referred to the following documents:

• http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-SCRIPT-TECHS-20041008/