Gridding the 960 using a “16px-based-ruler”

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”.
grid-10px.jpg. 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:
grid-16px.jpg
This is work in progress because the horizontal baseline is still missing, but you can download the image anyway.

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

« wellington strolls #2  |  12* series > wreck your journal #7 »


One Response to “Gridding the 960 using a “16px-based-ruler””

  1. The Lighthouse Keeper’s cat » Blog Archive » Gridding the 960 using a 20px-based-ruler and a 20px baseline Says:

    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 [...]

Leave a Reply


© 2006-2008 The Lighthouse Keeper’s cat | powered by WordPress 2.6.3