960 Grid System

960 Grid System

A few days back one of my client asked me to get in touch with 960 Grid System. At first when i did some initial research on this grid system my conclusion was “total waste of time” because for a normal size page you need almost 8-12 hours to convert a Photoshop layered document into valid and cross browser compatible xHTML/CSS. Using 960 Grid System will take at-least 20-25 hours. Even for this kind of Grid System to implement your Photoshop document must also follow their rules by starting your design in a grid manner. Basically the main difference is that once implemented HTML in a 960 Grid System you have complete control over the layout, you can add columns remove them easily and can move data here and there in a page without any issue.
I dont have much space here to show the implementation or screen-shots so i will rather redirect you to the original website demo page 960 Grid System Demo, here they are showing 12 and 16 columns grid, you can have other number of columns as well, depends on your needs, you can easily customize it.
If you are working on a large web2.0 kind of project then you must go for this grid system, i think they also provide the CSS for the same result they showed in their demo. You must be well aware to use exactly the same dimensions for the columns, overflowing may cause serious damage to your layout. In this kind of Grid i am not yet aware if they have the functionality of float right or not but you should test it. if not try adding a few extra lines of CSS code yourself 🙂

I will most likely work on this Grid System in near future on my projects and i will keep you informed about any new improvements in this system.
Thanks to 960 Grid system, we are going towards more standardized HTML/CSS code and we should adopt to these standards in the future. .