On The Road with Vicky Lamburn

Oh whatever can she mean? Has she in fact held hostage a talented and qualified web designer under her desk whilst passing off the work as her own? Or is she in fact stealing all of her designs from somewhere else? Maybe she has only been making websites since 2000 and not 1995?

Well none of those are the case. My first web sites were developed and tested using NCSA Mosaic on my Amiga in 1995, and all of my work is my own (except for the snippets of fixes that I occasionally need for Internet Explorer 6…)

My secret is in fact that very reason I have used a blog as my main website. I rarely come home these days and sit on my computers to do further website development. I get my quota at work 5 days a week. That’s not to say I am not interested in it really, far from the truth. I think the web is just about the most fabulous thing in the world. (Just think how different out lives are in the past decade because of the Internet and specifically the web.)

You don’t need a moving eulogy to the web though. What I mean is that since mid 2006 I have not maintained my own website, I use the blog as good way to get my work out on the web with minimal effort. I don’t run a CMS system (it’s only me after all, bit overkill) and I don’t run a web server.

Shadowplay Design Specification

Anyway I have knocked together my website over this weekend using a killer style that I have developed which I am going to be putting to good use elsewhere. This is my so-called Shadowplay design. It uses a number of things that I have wanted to achieve:

• Accessible design: First and foremost navigable easily with mouse, keyboard and other input devices.
• ‘Scalable’ in two senses:
  • Just as suitable for small sites and large sites alike
  • Increasing/Decreasing the font size yields a gracefully shrinking/enlarging ‘zoom’ as found in IE 7 and Opera and soon Firefox 3.  (NB: This is based on my flex CSS design idea but this is slowly becoming redundant with the majority of browsers having page magnification instead of vanilla text size increase. This is a back of a fag packet calculation that ~40% of users use IE7 and soon 15% of the public will use Firefox 3.)
• Little to no CSS ‘hacks’: I detest with a passion CSS hacks using commenting side effects. I respect these were once needed if you wanted your site to work on Gecko based browsers (Firefox/Netscape 6+), IE 5 (Mac and PC) and IE 6 but these days–no need if you know what you’re doing and your target is:
  • Internet Explorer 6+, Safari 2.0/Konqueror, Firefox (Gecko based browsers) and Opera.

  That is pretty much 99.9% of the web browsing platforms in use today (according my statistics.) The only ‘hacking’ is PNG transparency for IE6 via Javascript and the DirectX filter, and a couple of selective comments for IE6. That’s it.

  This is good because it means the core CSS file for screen output is clean and when IE 6 dies (hopefully a slow painful choking death…) I won’t be batting my CSS styles into shape with drastic surgery removing obscene looking CSS comment hacks that I will have long forgotten their function.

  That said I am still catering for IE6 as it’s the most modern Internet Explorer browser that can be run on Windows 98, 2000 and NT 4 (Of which cumulatively makes up ~10% of the browsing market) although I’m really hoping it’ll start to dwindle into 2008 allowing me to leave some of the slight IE6 glitches ‘unfixed’ as I think there needs to be an element of carrot in front of the horse here.

• Modern design that leverages the best of CSS based design, contemporary web design trends (the dreaded 2.0 aesthetic which on the whole is downright gorgeous in my book) and using ‘progressive Javascript’ that doesn’t break the site in its absence but subtly improves things without interfering with accessibility. (jQuery)
• Be a design that doesn’t shout about how good it is, but subtle and something you just appreciate its aesthetic without necessarily consciously acknowledging it as such. The same could be said about the commodity value of Helvetica as a beautiful design that’s just there.
• Small nimble size: How does 90KB in its vanilla form sound including jQuery! This includes all the graphics including gorgeous transparent PNGs.
• Valid XHTML 1.1, CSS 2.1 and up to WCAG 1.0 AA (Priority 2) spec.

As you can see the design brief was quite a tight one. And I am glad to say that I have met all the things I wanted to with this design.

Open Source

The other great aspect is that I developed it using open source free software. Virtually everything worked as well as it has done on proprietary systems in fact in most respects it was better as my humble T40 just soldiered through the work without missing a heartbeat. Whereas I would usually use Notepad, Adobe Photoshop and Illustrator I used GEdit, Gimp 2.4 and Inkscape. Apart from one minor skirmish which infuriated me in Gimp it worked a treat. In fact I do have virtually whole hearted praise to the Gimp team as 2.4 is such a vast improvement in my book as a Photoshop user that it’s just not funny. It’s like using a new program with all the annoying as hell bits ripped out of it. The new design uses graphics generated solely with Inkscape and Gimp.

GEdit does some funny things though on occassion, pasting doesn’t always happen at the cursor insertion point but I just kept an eye on this and I was fine. I don’t know whether this is a bug or not?

Summary

Anyway I’m going to quit jabbering on and I’m going to upload my new website (which will be a companion to this blog, the blog remaining my main area of concentration online) and post the link here and then you can decide for yourself

The other good thing is I have a website of my own to brandish at Barcamp London 3 next weekend Fancy that, was I the only web developer at Barcamp Brighton without my own personal website that I had designed?