Wednesday, April 16, 2008

Getting Griddy Wit It

What a dumb title for this post. Sorry. I'm tired.

I've been asking around, trying to find new ways of approaching layout and grids. Amy has said it's clear I don't "get" grids. True story. I look at the books and I see the grids but I can't seem to apply them to my designs all that well. Is there something I'm missing? Perhaps I've never made a spiritual connection with grids? Do I need to take a grid out on a date or buy it dinner to get in its pants?

Sorry, got sleepy again for a sec. Anyway if anyone has any totally awesome online resources or just general advice on how to use grids and work with layouts, something other than "This just isn't working," hit me up on here or e-mail me: mandyjulie@gmail.com.

Thanks in advance.

4 comments:

Joshua Harless said...

Kimberly Elam Grid Systems is a good read for those wanting to rock the grid.

Grid Systems in Graphic Design by Josef Muller-Brockmann.

Designing with Type by James Craig. Some grid info, but not much.

Thinking with Type by Ellen Lupton.

Ellen Lupton's site detailing some common grids.

Mark Boulton's Five Simple steps to design a grid

Personally, I enjoy a nice grid, trick is not to get too complex. Start out slow and simple. First decide what type size you will be using for body copy. In my example I will use 8.5 pt type with 12 pt leading--pretty standard size. The margins of the page would be multiples of 12 pt-maybe 36 pt (.5 inches) left and right margins and 60 pt top and bottom margins (top and bottom measurements don't have to match, and should be different than left and right measurements). If you are designing magazine spreads the inside margin would be smaller than the outside margin. Say inside 24 pt, outside 36 pt, top 36 pt and bottom 48 pt--all multiples of 12. Gutters would be also multiples of 12, usually for basic layout I leave it at 12 exactly. The number of columns should always be odd. Five allows for the most flexibility. Layout your body copy by flowing text into the four columns toward the center, the text box for one text column should span two grid columns. So on the left page you will have one empty column on the outside, a text column spanning two grid columns, then another text column spanning two grid columns. The right page is similar, with the empty column on the outside.

It also helps to create a baseline grid to align the text as it flows from column to column. Again this should be your leading size, and in this example 12 pt.

This will work as a basic grid allowing room for images and headlines. (Images can be placed in the empty grid column and if large enough break into the text columns for variation.

All of this may sound too complex, but once you start working on it it will make more sense. Grids are like the frames of houses, or skeletons, they give structure to the body--but can be used/ornamented in any number of unique ways.

Hope this helps.

Mandy M said...

Thank you Professor Harless! This is incredibly useful. I could never find these kinds of specifics about margins and columns that you have described so well.

Time to Rock the Grid! Thanks again.

Musings from Me said...

Josh--Thanks posting information on grids. You are a great resource for this class.

Amanda--Thanks for posting comments on my Project 4. All comments were very helpful. Thanks!

Lidia said...

http://www.pdf-mags.com/