design

The Manual

The Manual - Speaking of stunning books on web design and coding, this series of books looks incredible. If I was living in a country where I could buy shit off the internet, I’d have bought this instantly. Sadly I live n Lebanon where buying stuff and receiving stuff are two mutually exclusive things.

X

I’ve actually attempted to redesign this site several times in the past few years, but I always said that I would only do that if it was an improvement over what I had. Finally after 2 and a half years I believe I have that design.

This version has been in the making for the better part of 6 months now. It is without a doubt one of the simplest designs I’ve ever done. So much so that the whole thing only has a single image (the logo image). The design is definitely an evolution rather than a revolution. The general minimal aesthetics remain, the typography has changed only slightly (although the horizontal spacing has been rigidly adheard to).

In an attempt to bring the links that I had hidden behind a ‘shelf’ has been brought forward to highlight other areas of the site as well.

###HTML5 and CSS3 In this design, one of the things that I decided to do was transition to HTML5. This wasn’t as hard as I originally thought it would be, and would highly recommend the following resources as the ones that I kept going back to again and again.

I have not used any CSS3, but I think that’s something that I will eventually try as well. I’ve learnt over the years that a personal site is never complete and takes time to mature.

One thing that’s definitely going to be a new constant into my workflow is Joen’s Vanilla. Even if I didn’t do anything, this little bit of CSS gives me all the structure I need to make things look good.

###Responsive Design Another aspect that clearly came up, was that when designing a modern website, you are no longer designing one website anymore, you really should be designing a minimum of two. One for the large screen and one for the smaller screen. Each have different functions in a way, as if you put to much in one side, you end up limiting the other. It’s a balancing act that comes through in the design.

I’m not sure if I’ve achieved that balance correctly at the moment, but it’s something that I found very interesting. I was constantly working with a wider implementation of the site next to a narrow implementation. I found that actually there is a distinct difference between the minimum size that you can take your Safari browser to comparted to that shown on the iPhone. I have a lot of work to be carried out here still, but this is a start.

###Logo The logo has changed as well. It’s been stripped down and completely simplified, and in fact harkens back to the very first logo that I created for the site, back in 2004. I will be using the ‘X’ in a variety of ways over the next few years (as shown in my Cerebral Interviews newsletter, subscribe now if you haven’t).

###Colour Shades of blue have always played an important part in every Broken Kode design. This design brought back one of my favourite colours, turqoise. The dark aspect has been slightly tonned down a bit. While I’ve always loved the richness of the dark navy blue that adorned this site for the previous version, I always felt that you had to have a really nice screen to full appreciate it. This colour palette will seems faded out in comparison, but still provides a serious outlook.

###Typography and Fonts I didn’t change the font or the size from the previous design. I feel that if it isn’t broken which change it? Yes it doesn’t follow the trend of larger text, but to be honest, that’s not a big deal for me. There’s something consice by using an 11pt verdana font. The font that you use for a text heavy (mainly?) site, is profound of course. With the advent of Typekit and others, I could literally have my pick of just about any font that I could want.

Speed for me is important, but I’ve found that verdana serves the purpose very well. I might change if I find something suitable in the future, but it’s one of those things that I’d like to discover by happy accident rather than hunt for in a redesign.

###Future Evolution Hopefully this design will be tweaked slightly over the coming years, but hopefully I’ll keep refining it rather than redesigning it, much in the same way I did with the previous version. However I honestly feel that baring quiting blogging completely, I’ll keep this design for a good long while.