Grid systems allow a Web developer to layout pages in an organized and easy to read manner. There are many articles on the Web about using grid systems and also many tools for designing with grids. I thought I would outline some of the articles and tools that you might find useful:

A good place to start learning about grid systems is the article Grids: an invisible foundation at Ideabook.com. This is an easy to understand, 10 minute overview of how grid systems work. GRIDS MAKE EYES HAPPY: HOW TO USE GRIDS is also an informative read. Designing with a Grid also offers a good introduction to using grids and a sample grid PSD (Photoshop) file.

Tutorial Blog - A roundup of the best articles on grid systems. See article: Grid systems in Web Design

Web Style Guide - An easy to understand introduction to using a grid system for most new designers. See article: Design grids for Web pages

DesignbyGrid.com - Is an entire site devoted to using grid systems for design. There are many interesting and informative articles at this site in addition to examples.

ESWAT - This framework is meant to remove the hassle of recreating the same folders, HTML tags, CSS rules, Photoshop guides, etc. for every new project, and help create grid-based layouts in Photoshop to boot. See article: ESWAT web project framework

Smiley Cat Web Design - Here you can download a gif or png file of a grid that you can attach to any Web page you are developing as a background image. This grid will help you to layout objects precisely. See article: Using a Background Image Grid to Lay Out Your Web Site

Air Bag Industries - Has a terrific ruler that you can download and apply with CSS as a background image on any element. See article: Ruler

Mark Boulton - Has numerous articles on grid systems including Why Use a Grid and a Five Simple Steps to Designing a Grid System.

Be sure to read the article Oh Yeeaahh! at Subtraction which is about redesigning a familiar web site with a grid based system. This article includes an excellent, 152 page presentation, Grids are Good, to read. (Please do not print this presentation in our temporary class)

If you haven’t found enough grids to work with either as background images or in your favorite image editing software try Grid Designer to generate a grid with your own specifications.

Finally, there are several frameworks available for use by developers. Blueprintcss by Google (tutorial) and Yahoo! UI are two framework sites to help you to get a head start on your Web development process.