The original index page was created in 2001 and has - apart from modifying some contents every now and then - not been changed radically since then. The overall design and the underlying "technics" essentially stayed the same throughout the past 7 years, and here´s how it looks:
Although the design always seemed somewhat "fair enough" at least to me, it should be mentioned that this original page has - under the hood - been realized using some "archaic" development technics which were well acceptable in 2001.
But hey, we´re at the end of 2008 now, and I just thought it´s about time to replace the previous (heavily nested) table-based layout...
table outline, done with the Firefox Web Developer Toolbar
Well, you might say "it doesn´t look that different from the old version, just less cluttered" -- but trust me, this has exactly been the purpose of this refurbishment. My customer´s website has become pretty popular over the years, and I considered it mandatory to rather retain the site´s established recognition value instead of throwing out the baby with bath water just because "I could".
The new page doesn´t have any tables, it basically consists of a few "containers":
- a centered container on top to hold the company logo, the h1 content and some extra text
- a left sidebar which contains a textual summary of what the company does
- a central container which holds the "first priority" property offers incl. links to the corresponding detail pages
- a right sidebar which holds a variety of links to several website sections
The CSS-only page breakdown looks like this...
CSS positioned elements outline, done with the Firefox Web Developer Toolbar
... and I´m sure you´ll agree that this alone represents a substantial progress in comparison with the previous table based version for a variety of reasons: no more spaghetti code, a notably leaner page without bloated and redundant HTML markup, much easier to administrate because the CSS rules have been sourced out to an external CSS file.
The makeover process as such has been a pleasant and comparatively speedy experience, and I cannot praise Dreamweaver CS4 enough for not only providing several excellent and well-crafted CSS only page layout templates (done by the fellow Adobe Community Expert Stephanie Sullivan) to choose from, but also for improving the overall workflow when it comes to realizing CSS based web page designs in particular.