If..Else Log

(CSS) Rebooted

Having supported the last CSS reboot, I thought that it was time for me to join in and reboot this site as well. So, with not long to go, I decided to put on my designer boots, knuckle down, and work on the next iteration of ifelse.co.uk. Despite interruptions such as dealing with a kitchen renovation and FA cup football, I finished ahead of schedule. As such, instead of teasing you all with reboot previews, 1 I've decided just to go live with the whole gig.

Front Page

Redesigned? Realigned? Rebooted.

Each of the last couple of redesigns for this site have brought major overhauls to the look and feel; not only did each of the design bring about structural changes (for example, moving from a 3/2 column switch design to what is now known as a fat bottom design) but they also brought in overhauls with the colour scheme and imagery.

And, to a certain extent, so does this iteration. Gone is the fat bottom and in comes a new flexible multi-column design. If you were a fan of columns and you own a wide monitor, then rejoice.

However, regular readers will notice little inklings of familiarity. Whilst the header has undergone change along with the colour scheme 2, it's change as evolution; I hesitate to use the words brand or identity but there's enough touches to help make this feel like the If..Else that you've remember.

Black Gold

The new look hasn't totally annexed the old; it's more a case of the old design gently ushuring in a new successor.

Horses for courses

The more astute of you will have noticed a few developments with regards to columns. Firstly, if anyone is reading this post directly, take some time to go to the front page. Then head back to this post. For those of you using a resolution of 1280×1024, try resizing to 1024×768. Those of you with 1024×768, try dropping down to 800×600. Don't forget to scroll down to the bottom of the page.

Don't worry, I'll wait till you're ready.

Landing portal

OK, let's discuss the front page. This is the first place that many people will visit.

Front Page

One of the things that I tried to do with the last couple of designs was to make the front page a real landing page. The home page shouldn't just be a chronological listing of your posts. It's also the place where visitors will arrive at for the first time. Let's try and hone the experience so that both the reader and ourselves benefit.

Let's highlight the lead/latest post so that we can draw attention to the important content. Let's segregate out our little asides, shorts and snippets so as to note dilute our main content. Give the readers a focused set of exit points to other content or parts of the site. By all means provide information but provide it in a way so as to not overwhelm the user.

Different layout for different situations

It's time to embrace wider screensizes. According to the everyone's favourite fresh smelling oracle, the lowest resolution on which this site is being viewed at is 800×600 by 4% of my readers3.

I don't want to provide an inferior experience to anyone, but by not taking advantage of improvements in screen real estate, that's what I'm doing. And so, with some help from our man in blue, this site is now sporting a resolution dependent layout. However, resolution dependent layout sounds so technical and sterile; I call it a tailored layout, a design that accomodates you. Besides, if Simon Collison gets away with it, who am I to argue?

800 layout

There are 3 layout types; one for people with 1280×1024+, one for people on 1024×768 and one for those on 800×6004

Quick search

1024 layout

Searching was neglected in the previous design; in fact, I didn't even show the search bar anywhere else apart from the front page. That said, I do find myself searching back for old posts (mainly my shorts which serve as my personal del.icio.us) and seeing as you can't develop a website without a mention of everyone's favourite kitchen cleaner, I decided to spend a bit of time plonking down a fancier search bar.

Different layout for different situations part deux

I've talked about two layout scenarios so far. There's the front page and as well as the resolution dependent layout. What we can look at next is the internal page layouts i.e. for a given blog post. Quick question: if you're viewing a blog post, what are looking for? The answer is content. So if that's what the reader is after, let's make it comfortable for them to read.

Post layout

The general layout and colour scheme already gives the content an advantage but by increasing both the content area and the type size, it feels just that much more nicer for lack of a better word. Besides, this gives me an opportunity to use larger images which is always good, right?

Your thoughts

If you've made it this far, you must either have superhuman willpower or a severe bout of insomnia. Well now it's your turn. Any feedback5? Besides, this is a good opportunity for the lurkers amongst you to come out of hiding and post a comment:)


  1. Yes Bryan, I'm looking at you:) [back]
  2. The last theme was dubbed Black Gold and though neither are dominant colours any more (in particular, the infamous gold colour has mellowed out and black has taken a back row seat to the other colours), they're still around albeit if only in more of a background role. [back]
  3. Personally, I've standardised on 1280×1024 but in the last month, there were over 3 times as many readers that ran their machines with even larger resolutions than those that were still on 800×600. [back]
  4. There's even a pseudo-big-footer of sorts. [back]
  5. That said, can I ask kindly that browser-specific issues/bugs are emailed to me rather than being added as a comment? Cheers. [back]
Add to the discussion

Older Entries

AdSense annoyances

When Adsense was first unveiled, it was a bit of a revolution. Unlike banner ads, they were unobtrusive. However, lately I’ve been seeing a worrying trend. Now that Google have changed their T&C to allow you to place up to 3 ad blocks, far too many sites have gone ahead and done so and are destroying their potential readership.

Read More

Revisiting design and spam

Another day, another redesign and another trek through comment spam.

Read More

Tweaks and touches

I’ve hacked together a “clean” version of the cobalt theme. The themes are, naturally, selectable via the theme switcher on the sidebar.

So which theme do you prefer?

Read More

Gravatars, spam and social discussions

Last night a few spam comments managed to get through my WP setup which got me thinking about how we can leverage the Gravatar infrastructure.

Read More

Using gravatars

As I announced earlier, Gravatars have now been enabled on this site. I’ve been a bit behind the loop on this one as they’ve been popping up virtually everywhere. However, my reasons for not enabling them sooner is not because I wasn’t aware of them.

Read More

Where we are today

Part of the reason why I rushed through this redesign was the realisation that the typical blog layout, that is a strictly reverse chronological listing of posts, wasn’t really a good match for me and how I use this site.

Read More

Redesigns and experimentations

Barely a month since the last redesign and what do you know, I’ve changed things again.

Read More