fluid-tog fixed-tog

Web developer Daniel Portillo explains the background to and process of re-building the web site.

The “Why?”

The old site was a very fine job done by Messrs Williams & Weeks way back in 2001. However it was built using what is now considered very ‘old school’ methods, i.e. tables for layout with embedded presentational tags.*

"...the sad fact remains that a majority of web users across the globe still use Microsoft’s Internet Explorer; a now long-in-the-tooth browser with poor support for modern web standards."

The disadvantages of this for the web master are numerous, though more important are the downsides for the visitor in terms of accessibility. Visitors with a visual impairment that need to use reading aides suffer, because screen-reader software will really struggle to plough through the ‘tag-soup’ of tables and hence the experience is compromised.

Also, for those with limited bandwidth and/or accessing the site at times when internet traffic is heavy, pages and images can be slower to load than is ideal.

The “What?”

I had always liked the look of the site, and from discussion with MW, it seems so did the legions of Graham’s fans that regularly visit! Consequently, we decided that this would not change in any radical way. My task was to keep the look of the site, using existing images wherever possible, but re-building it to modern web standards to enhance the end-user experience.

On one hand, the process was simpler than designing a site from scratch because I already had a “blueprint” from which to work; providing the original look was retained everyone would be happy. However, sometimes it can also be more difficult to accommodate an existing design than to create one from scratch.

The “How?”

I began to create style sheets that would replicate the look of the original but adhere to modern web-standards and accessibility requirements. I fully support and believe in the goals of W3C, WaSP et al and passionately believe in creating web sites from standards-based XHTML & CSS.

However, the sad fact remains that a majority of web users across the globe still use Microsoft’s Internet Explorer; a now long-in-the-tooth browser with poor support for modern web standards. It’s fair to say I spent a good percentage of time working around its deficiencies. If you’re still using MS IE, I urge you to consider using one of the many excellent alternative browsers available such as Mozilla Firefox and Opera. However, I digress!

In addition to the afore-mentioned style sheets, I also set about creating the pages; re-coding much of the existing content in the process. For the technically curious amongst you, all work was done by hand (rather than with a WYSIWYG page creator) on my trusty Macintosh. The process would have been infinitely more difficult without the excellent “BBEdit” text editor and later on, MacRabbit’s CSSEdit.

The “Benefits”

In addition to viewing the pages in a fixed-size layout, the visitor can now opt for a ‘fluid’ layout in which the main body of content re-sizes with the browser window. This is useful in these days of ever-increasing screen resolutions, and particularly for those preferring to view web pages with increased text-size.

File sizes of pages are now lower, since many of the previous images used for text have been replaced by text and there is considerably less JavaScript. For those on more bandwidth-limited internet connections, pages will load more quickly. The pages now validate to W3C’s XHTML 1.0 standard and the CSS files also meet the standard.


I am a web designer/builder based in Cardiff, Wales (UK) that passionately believes in building standards-based web sites. If you need a new web site or would like an existing site re-built, get in touch:

*sadly there are far too many people still using these methods, but that’s another story!