Design With Grids: 960 Grid System

Recently contributors from our in-house design team are conducting training sessions on 960 Grid System concepts. I would also like to add some valuable resources for all who would like to adapt to this format.

Designing with grids is very common as it helps creating identical, measured layouts.

960 Grid System is an effort to streamline web development (for rapid prototyping and for production environments) workflow by providing commonly used dimensions , based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
Why 960 pixels?

All modern monitors support at least 1024 × 768 pixel resolution. 960 is divisible by 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 and 480. This makes it a highly flexible base number to work with.

What is in the package?

In the download package, you can find PDF grid paper, templates for Fireworks, OmniGraffle, Photoshop & Visio, and CSS framework with demo HTML .