Gridding the 960 using a “16px-based-ruler”
April 10th, 2007 by sissT
There is an update to this post: “Gridding the 960 using a 20px-based-ruler and a 20px baseline”. Sometimes you even have to change your dearest beliefs ^_^!
A few days ago i did study “The Elements of Typographic Style Applied to the Web – a practical guide to web typography” and i was again amazed how good this article is. I talked with The Viech about it. So today he send me another article about “Setting Type on the Web to a Baseline Grid” by a list apart .
In the introduction the article “Gridding the 960″ by cameron moll is mentioned. I am considering to use an even wider width for a web design i am working on, so i had a look at the article searching for some arguments to keep the 960px width.
There is a very good image showing a “Background image grid + pixel ruler + column divisions for 960px-width layout, all in one mean little package”.
. You can download the full image following the link to the article.
Something alway irritates me whenever i see these Images to control your css-layout. It is the “pixel ruler”, it is based on a “normal” ruler a 10px grid with 10 subdivisions. My designs are usually based on a Photoshop 16px grid with 4 subdivisions. So for me i would be much easier to have a ruler based on 16px something like this:

This is work in progress because the horizontal baseline is still missing, but you can download the image anyway.
July 11th, 2008 at 12:48 am
[...] a follow up of the post “Gridding the 960 using a 16px-based-ruler” about a month ago and is based on the recent discussions about using baselines or a basic leading [...]