Did you know my Coffeekid site is over 2 years old now? And there’s almost 450 pages on the site, not including the recently removed “reviews” section. All hand coded. It’s become a monster. And while the design is something I’m proud of, for a long time I was thinking the site is a bit long in the tooth.
So I’m designing the new version.
To the right you see some screen shots from the test pages, laid out in HTML, using DHTML, CSS, and a bit of javascript. It’s still a work in progress, but the design is more or less complete now.
The “design” of the site is changed quite a bit from the previous site. Version 1.1 of CoffeeKid (not many people know there was a version 0.9 and 1.0) had a kind of cartoony focus with fun fonts and lots of original (and some commercial) cartoon style clip art. I liked that design, still do, but for this new version, I had to find a way to not confuse people who visited, but still change it to something that I’ve wanted to do for a while now – a website with photography as the primary design motif.
I worked on this by keeping many of the cartoony clip art images, doing some new ones as well, but using them in a very de-emphasised way. They still identify sections, but they are not the primary indicator.
Color was another issue to tackle. CoffeeKid V1.1 is very much a “coffee flavoured” colour scheme, with browns used all over the place. I decided to retain this for the two most important parts of the site – the left-side navigation bar, and the rants page features the same tan brown for the right side.
As you can see from the screenshots, photos play a major role. And the website is highly elastic (meaning it stretches to fit bigger browser windows). But unlike some of the other recent websites I’ve done, I was very cognizant of keeping text line widths down to around 15 words at 800×600, and a max of 19 or 20 at 1024×768 window sizes. This should ease a big complaint (one of few, but one heard often) about CoffeeKid V1.1 – on some pages, the lines of text are just too long to read comfortably.
One other issue with the site that came down to choices was browser compatibility. Unlike the commercial work I do, where tight compatibility with many types of browsers is crucial, coffeekid is my hobby site, and well, I’m not selling anything. As such, I decided to only support current browsers – that is Opera 5 and above, Netscape 6 and above, Mozilla 0.9.2 and above, and Internet Explorer 5 and above. People using other browsers should be able to view all the content on the site, but I can’t (well, won’t) guarantee how good it will look.
I’m looking forward to getting this thing out the door, and launched. We (WebMotif) have to finish commercial (paid for) projects before I can unleash my programming gurus on this personal project, but I’m hoping it might be live within a few weeks.
