Thursday, April 30th, 2009
960 Gridder: Easy to use layout design tool
Andrée Hansson has created 960 Gridder, a grid layout tool for web developers that you can either use as an integrated component to layout your websites or use it as a bookmarklet. The grid is fully customizable but it defaults to the “960px grid standard”.
960 Gridder will automatically identify if jQuery is present at the website and if it is not, it will include it.
It injects your website of choice and you can then work with this tool to help you out with whichever layout/design task you find it useful for.
By default, it is set to work with 12 columns, 60 pixel wide columns with a 10 pixel spacer left and right of the column, making it a 20 pixel wide gutter (which actually is the ones this gridder renders).
You can see and read about the “960 standard” at http://960.gs.
It’s very good & flexible. Weirdly, Andree and I produced similar jQuery 960 grid bookmarklets on the same day. Mine only works with 960.gs though
http://www.badlydrawntoy.com/2009/04/23/grid960-a-grid-overlay-bookmarklet-for-960gs/
I blogged about a bookmarklet I wrote earlier this year for the same purpose: http://thelucid.com/2009/02/07/lucidgrid-a-bookmarklet-for-working-with-grid-based-layouts/
I forgot to mention that the lucid version is not limited to 960 grids.