A web site is born (the technicalities)

27 November 2003


A Blue Perspective: A web site is born (the technicalities)

The discovery of XHTML/CSS was my emancipation from the cold, cold shackles of table-based web design. The likes of Jeffrey Zeldman, Douglas Bowman and Eric Meyer showed me the light (praise be!), allowing me to forget about optimising HTML code for a five year-old browser and concentrate on keeping the code lightweight and standards compliant, and removing my dependence on Dreamweaver to navigate the seven-deep nested tables with 14 columns and 15 rows.

Though I had planned to assemble my own personal ramblings and collections of work online for a while, XHTML/CSS acted as the catalyst for this site. My aim was now to take the random snippets of code populating developer sites — styled lists, column layouts, image replacement — and assemble it into a coherent, practical site that exceeded my previous table monstrosities. This meant that I would not bow to pre-conceived XHTML/CSS weaknesses: anything that I had planned in a table-based format should be possible using the new techniques. This was responsible for many headaches, but the satisfaction felt once a solution was found made it all the more worthwhile. As any creator will know, by challenging the limitations of the medium in which you work, you reach greater levels of creativity.

So, as a result:

  • This page does not have a fixed-width — I often feel that a fixed width page is a cop-out of sorts and ignores a crucial factor in web design, even more so for fixed height pages (Flash anyone?).
  • This page has a true footer — visually, the main content area does not extend into infinity; the columns terminate at a finite point. (although there is some slightly cheaty javascript that is invoked in unusual circumstances)
  • The cracks surrounding the content area expand for any size window, both horizontally and vertically, similar to Bowman's Sliding Doors but in two dimensions and with more complex elements. (you just re-sized the window, didn't you?)
  • Although the wallpaper in the background looks like a simple tile, the blurring of the shadow around all edges of the content area means it's not possible to use one image (it would have been a hell of a lot easier with .PNGs!), so this has had to be stitched together seamlessly.

These are the most visible points, but there are plenty of small little features that you figure out on the way to your destination and forget thereafter, so feel free to scour the code if you're so inclined.

As a final note, probably the most heart-breaking thing about developing in XHTML/CSS is that it comes so close in many areas, but falls just short. Sketchy support for standards means that a semantic Web (purely non-presentational HTML) is a distant pipedream, and that your pages must still be littered with redundant mark-up in order to achieve graphical effects beyond your standard two-column, black-and-white blog. This is particularly true when trying to get something to display correctly in IE 6.0 for PC, which is infinitely buggier than 5.5.


, ,

Previous Entry

Next Entry

A web site is born


  1. 1/2

    Art Mercer commented on 11 December 2003 @ 20:45

    Can appreciate the effort it takes to do anything in a web page with style or flair of any sort, I teach science and technology courses at a high school and instruct in very basic html coding for digital portfolio material. Often need to put content online and the effort it takes compared to paper is humbling.

    Now for being a critic - the validator list at the bottom breaks and wraps orphaning the wrapped part, should the break be better after your name keeping similar content together, and insuring that 'back to the top' is truly the bottom text? - also 'switch off style sheets' which I clicked many times and couldn't see any difference ( a compliment) maybe should give an indication if they are actually on or off, just for feedback sake...?

  2. 2/2

    Tim commented on 6 February 2004 @ 12:21

    your use of css is stunning and incredibly creative...
    [found you from stopdesign]

    i've been trying to learn the best practices css design from the gurus and you are certainly in that small group. it cracks me up [get the bad joke] how much i need to learn. thanks for the inspiration to shoot way beyond my short term goal of simply using css for everything including tables and creating the 3d shadow effect.

    keep up the inspirational work cameron.

  3. Leave your own comment

    Comments have been turned off on this entry to foil the demons from the lower pits of Spamzalot.

    If you've got some vitriol that just has to be spat, then contact me.

Follow me on Twitter

To hear smaller but more regular stuff from me, follow @themaninblue.

Monthly Archives

Popular Entries

My Book: Simply JavaScript

Simply JavaScript

Simply JavaScript is an enjoyable and easy-to-follow guide for beginners as they begin their journey into JavaScript. Separated into 9 logical chapters, it will take you all the way from the basics of the JavaScript language through to DOM manipulation and Ajax.

Step-by-step examples, rich illustrations and humourous commentary will teach you the right way to code JavaScript in both an unobtrusive and an accessible manner.

RSS feed