Zooiblog

Search the Zooiblog

Support this site.

Finally, announcements!

Okay okay okay! It’s late! I know! I’m sorry about that, but there are reasons, most of which I won’t even tell (tee hee!). Firstly, I’ll add that I don’t have Jina’s definitive judgement, but trust me when I say that the three Jays unanimously chose the ultimate winner.

All right, I’ll not give this too much of a speech. The winner of the Color Schemer application and the obvious fame is Terry with his submission. Congrats, Terry. Hope to see more of you soon!

The jury’s opinion

First of all, here’s what mister Oxton had to say.

“This one just feels good. Nice muted colour combo, nice illustration, nice typography, nice attention to detail for those browsers that can, all in all it makes me wanna bang on a bit of Massive Attack and pass the Dutchie on the left hand side. What more can I tell ya? Nice job Terry.”

Jeff chimed in with this sound one too (it’s darned long! w00h!).

“This great entry combines some fun visual design elements (love that gangsta illustration!) with some clever, advanced CSS. In particular, Terry has managed to make great use of a single background image (corners.gif) in multiple places (the main navigation and each of the content boxen) and in different ways (note that the same image is used on hover, but the appearance is different). Additionally, there is a creative use of text-shadow in which the placement of the shadow changes on hover. This is probably not a great idea from a design perspective (it sort-of awkwardly creates an off-balance visual when there appears to be two light sources), but kudos to Terry for thinking of-of-the-box when it comes to hover effects. Terry also effectively uses the before and after pseudo-classes with automatic content generation to editorialize on Rob’s rather mundane headers. Finally, this design uses fixed positioning to keep the right-hand main navigation on the page at all times. All in all, I felt like this design did a great job of demonstrating more advanced CSS tricks, which was one of the main goals in this contest.”

Thanks guys, and once again Terry, nice. John’s rather tough about stuff, so there you have it ;)

Personal favourites

There are also runners-up, because sometimes you just can’t choose. First one’s Oxton again.

“Tempting as it was to give the “my favourite” to the simply stunning Trovster entry, I just felt there was something a little “done that, got the T-shirt, got the copyright” about it. So in the end I chose Faruk’s
rendition
and for one reason above all else, it’s elastic and I do really like elastic-based design; and of course I talk to Faruk often and I wouldn’t ever give out a big up to anyone I didn’t know personally… ahem!”

Honest as ever, good ol’ John. Here’s Jeff’s favourite, people!

“In his entry, Kevin comes out swinging with some crafty CSS, a nice three column layout, and a lot of orange (and who doesn’t love orange?!). I especially like the navigation, which is flexbile in width can looks nice no matter how wide it gets. The use of auto-generation content with the after pseudo-class to create a chevron on hover is a nice touch, as well. I was especially impressed with the way Kevin dealt with the blockquote. He uses attribute selectors in combination with the after pseudo-class and content generation to put the referenced URL neatly beneath the quote. Lovely. It’s too bad it can’t be a link, but I don’t believe this would be possible without bringing javascript into the equation. Although it is most certainly a hack, and not something I’d recommend doing in the real world, Kevin also come up with a very creative solution for the main header of the page. Rob had the entire header, “Funkin’ with CSS. Using CSS to the max” wrapped in an h1, but Kevin wanted to use the two sentences separately. In order to do this, he hid the actual h1 in the background (by making it the same color) and used auto-content generation to add one sentence before the header and one after. Again, this is definitely not the ideal solution (ideally you’d put a span in the h1 or use image replacement), but it shows great ingenuity in dealing with the restriction of not being able to modify the XHTML markup. Crafty!”

Congrats, Faruk and Kev. You did well.

Wrapping it up

Well, first to state the obvious. It’s got bit overdue. Sorry people, for the second time… Now, Terry: you’ll be receiving some mail very soon. So will you two guys, Faruk and Kev. To all of you who participated: thank you! It was certainly fun to see how people dealt with my crazy content, and I hope people learned from this. I hope you all enjoyed it, and if the chaps participate, there will be some small write-ups online soon as well. Stay on the lookout.

P.S.: If anyone wants his design listed on a permanent page for people to look at whenever they please, do mail me the CSS and the images you used (zip ‘em up, whatever!) and I will put it online. The others will cease to work soon, because I will disable the PHP file in its current functionality. Those of you who won? I’ll talk to you about it, fo’ sures!