One thing I have always thought is crucial for any website, and also print for that matter, is the importance of an underlying grid. It makes designing easier – gives consistency and offers an overall structure. Someone once said to me that a page without some sort of grid to it will never look balanced.
I used to start webdesign by using of a simple column grid such as a 3 or 4 column and try and keep other measurements such as padding and margins consistent. Now I realise that its better to have a more complex grid which then decides all these measurements for you. This in turn is transformed into however many columns your main site needs and is far more flexible. I have only done a couple of websites so far using this system, but thought I would share the files incase they are useful to anyone else. It is pretty flexible and can just give some overall structure. I based the system on the BBC website which has an underlying 16 pixel grid. This is then divided into however many basic columns. The photoshop file available for download contains layers for an underlying grid as well as 4 and 3 column designs. It is set up to the most popular browser size 1024×768. Anyway, hope it helps and by all means let me know of any improvements.
Download here…
Website_template_16_pixel_grid.psd






Pingback: fred design » Free downloadphotoshop website design grid template | Download Free Software Now!
Pingback: [User Link:Free photoshop website design grid template] | Tips for Designers and Developers | tripwire magazine
Pingback: 125+ Fresh Useful Articles for Web Designers | tripwire magazine
Pingback: 125+ Fresh Useful Articles for Web Designers « Mingyu
Thanks for sharing this grid..this is really awesome. I usually create my own grid whenever i design a new website, but this really cool to start up with..
Cheers~
thanks so much, this is so helpful!
Thank you for making this available!
Thank You! It is very helpful especially for a novice like me! Cheers.