Archive for the ‘Photoshop’ Category

960 Grid System for designers

April 13th, 2009 | No Comments »
Posted by Aaron Reimann under Photoshop, Web Development

I decided to go with a grid system called 960 to lay this site out.  It is basically a CSS framework.  CSS in itself is not complex enough to really call it a framework, but for my purposes that is what I am calling it.  The framework is based on this: “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.”

So I downloaded the .zip file that they give you.  I snagged the Photoshop file and started designing.  The PSD file has a bunch of markers, so when you draw a box, it will snap into the right place.  You don’t spend as much time making sure everything winds up in the right place.  Nor do you have odd (strange) numbers, like a width of 934.

This theme (ishinelight.com) was my first 960 design.  Check out the source code, *maybe* it will make sense.  Or just go to 960.gs and download the .zip file yourself.  It took me about 5 minutes to realize the power of it.  Anyway, it’s a short post, but it has changed the way I code now.

 
 
Theme by A. Reimann