blog layout and theme update 06/10/07

A few months ago I began reading about grid based design and came across two guys in particular who wrote well on the subject, namely Mark Boulton and Khoi Vinh. I found it all very interesting but didn’t quite get the idea. I mean how to actually apply it to layouts etc. Sometimes you have to read these things a few times before the penny drops.

My initial understanding was that there was simply one grid, a bit like graph paper and one would simply use that to line up ones elements on the page. And so couldn’t really understand what all the fuss was about. But after some more recent reading and online research I realised that there is a specific grid for each design. Then it started to fall into place.

You start with your width and then divide that by a certain number of your choosing. Then you take multiples of that number to create your content areas. So if you divide your overall width by 5, then a 3-column design could be 1 x 3 x 1 or 1 x 2 x 2 etc. This is the part that I didn’t get when I read about this a few months ago.

So I took a screen shot of my homepage and then overlaid it with some transparent colour blocks in Fireworks. I divided the width, which is 729 by 7 which gave me roughly 104 pixel columns. But what does that mean? It means that the single page is now at full width and the narrower column with the side bar is a bit wider and the side bar is a bit narrower. It has a tighter look and a bit more coherent, but still there is something missing. So I’ll keep on tweaking.

Anyway, hope you like it.

Leave a Reply