Site History

Warning - this page now rambles on a bit. If you're not into web design you may very probably get severely bored if you try reading through it all!

The descriptions that follow are vaguely sequential, covering my first efforts at design through to the most current version of these pages. The Web is a very tricky medium to create for, and there are no end of design philosophies to choose from. I've tended to go with what I felt made sense, although as a result of taking the Masters course in 1999/2000 I'm now more aware of design issues. Anyway, you'll get the idea as you read through. Incidentally, being a student for the past few years, I've never really had access to professional web design tools - in case you're wondering why I always seem to be doing the authoring equivalent of rubbing two sticks together!

It was only in my final year at Durham that I had a PC to call my own, and started getting less anti-graphics in my thinking. I helped out with ON Magazine's graphics and in so doing got pretty proficient. My scanner was also colour for the first time which allowed me to scan in photographs to use on my pages which actually looked like the real thing.

The result of that revision was the first incarnation of the Archipelago. It included more real content than had been the case with my previous efforts and used more complex sets of frames. This was largely in an attempt to simplify maintenance of the larger site, although I recognised in putting it together that frames could bring about certain problems. However, in general I was quite happy with it.

This redesign reflects the fact that the site has taken on certain themes, and that its contents can be grouped by those themes rather than as specific topics in their own right. This allows for expansion in the future by adding more pages under broad headings, rather as Yahoo classifies sites.

In addition to this new categorisation, the Archipelago no longer uses frames, as you'll have noticed in scrolling down to read this. I've switched to using tables to produce columnated pages, as partial screen width text is apparently easier to scan than full screen width text. This has the advantage of producing standalone pages and also reduces the number of files needed.

With screen resolutions increasing and various browsers available, this redesign has also tried to allow for any combination going. This was a shortcoming in the previous version - while things were always readable, I always hated the scroll bars which appeared on the frames in some instances. Tables seem to be favoured by 'those in the know' as a better way to do things than using frames, and I can see why; provided you plan things well in advance it does reduce the number of files you have to worry about.

The other emphasis of the work was to make the pages display identically in Explorer and Navigator. This was quite frustrating at times, and I fell back on HTML documents for reference. HTML may be a standard language, but unfortunately its specification falls short of dictating how a "visual user agent" should actually display things. I begin to see why some pages explicitly target one browser or the other and not both. That said, Explorer allows a lot of rather poor coding, although apparently IE5 does better than IE4...

As a result, and partly due to a coursework requirement for the Masters, I downloaded several freeware and shareware packages from Rocket Download with site creation in mind. This was a major break from tradition for me, as I'd never had to fall back on dedicated software before. This paragraph is being written using PageBuilder which is a shareware design tool. It has a very reasonable 60 day trial period and an equally reasonable price tag afterwards. Perhaps the single most useful features for me are templates and a global search and replace tool. The latter allows me to make sweeping changes to multiple pages very easily, provided I keep the common text elements closely controlled.

At the same time as finding PageBuilder, I did some additional reading around HTML 4.0. I was interested in style sheets, but haven't yet implemented them. This interest arose out of the fact that the text of my page was being displayed in different ways in different resolutions. Unfortunately style sheets alone can't solve this problem - they can dictate layout, and an exact font size, but not a size relevant to the screen size. Of course the user can alter font display sizes, but it just illustrates the difficulty of publishing for a page of unknown size.

That brings me to the reason for the April 2000 redesign. In fact, there were several reasons. The initial one was a decision to alter the colours of the site away from white on blue to a more traditional black text base, as some people (or perhaps monitors) found the former mix to be difficult to read. I also opted to reverse my decision to merge the site navigation buttons into the second column. This allowed me to get the page width below 640. Previously I'd fixed the table size to 770, but decided that I wanted a format that would adapt to any resolution. Although cramped, every page will now fit into a 640 wide window. The site's also been more closely tailored to a palette of only 256 colours.

The other big change, and possibly the most headache inducing one, is that I've put most of the pages into their own section relevant directories. These don't exactly reflect the ordering of the site on the Web, but allow me to do rapid changes on single sections using global search and replaces. This reflects the fact that each section has elements specific only to itself. The headache comes from the need to bounce around directory levels - it's a whole lot simpler if everything's on one level! However, one nice thing about the change is that I now have index files in all these subdirectories which function as introductions to the relevant sections. These are useful for overviews, mentioning changes and so on, and also allow each group of pages to stand on its own even if only the directory name is used. Apparently search engines may also weight those pages more heavily, in effect treating them as a separate site.

Finally, I've added in what I call a site location element. This is a "You are here" sort of idea which I've seen used elsewhere. On a site like mine it's a degree of overkill, because I don't have that many nested sections, and where you are is normally quite obvious. However, I think it is useful if you follow a link which jumps from one section to another as it gives you an at-a-glance idea of where you've moved to within the structure of the site. As this isn't being done automatically (don't I wish!) it gives me freedom to nest sections in the future without actually changing the underlying directory structure. I imagine Dreamweaver probably does this sort of thing with one hand tied behind its back, but I'm on a shoestring budget here, so...!

This time I've taken things a step further - in addition to basic headers and footers, the pre-publishing pages use key phrase inserts for site and section specific navigation. This means that I can now alter just one file to affect the whole site or just a section. Although time intensive to do, it should allow me to add more to the site in a shorter space of time than would otherwise be possible. The irony is that this supremely useful element of PageBuilder isn't particularly well flagged - I only realised by accident that as well as inserting dates and times of publishing you could also define your own inserts.

In taking advantage of this feature I've also redesigned the presentation of the site, which I'd been meaning to do for some time. Previously the sections listed in the Jump To section were graphic buttons in two rows across the width of the screen, and the section logo appeared at the top of the left hand column. Now far fewer graphics, and smaller ones (generally) have to be loaded in each time. As the section logo now appears at the top, flanking the navigation options, the section specific links are more obvious on loading a page for the first time in an average resolution.

I've also reverted to black text on a white background for the content pages to try and give the page a cleaner feel. I now use a basic style sheet to set font style and size. The drop down list is also new. Although I tend to avoid using Javascript, it doesn't add much to the size of the page and it creates a very compact way to access the sections of the site without the need for multiple buttons. Although I could have just used text links as I did with the Grotto, I think this is neater and keeps the complexity of the page down. Should the script not work, the Site Map provides an alternative method of navigating the site.

As I'm now earning I may think hard about getting Dreamweaver - we're getting it at work soon so I'll have an opportunity to try it out. However, as I tend to keep my sites graphically simple I think PageBuilder is likely to remain my mainstay for the time being. For what I didn't pay for it it's proved to be a very solid tool.

Cheers
Andy Thomas
WebMaster

Last updated 31 January 2002

How to support the webmaster!