Research into Grid Use

Having worked with grids last year I was faily confident with them and their uses.

Books

  • “Grid Systems in Graphic Design” by Josef Muller-Brockmann
  • “Making and Breaking the Grid: A Graphic Design Layout Workshop” by Timothy Samara

Things You Probably Don’t Know About Grid-based Design

“The grid is the most vivid manifestation of the will to order in graphic design. […] Units are the basic buildung block of a grid. They’re all uniform. Columns are the grouping of units that create the visual structure of the page. They are not necessary uniform.”

“One of the larger problems in working with grids in web pages is that you often can’t do much about vertical proportions. Often your content is dynamic, so the best you can do is approximate. […] So the focus is usually on the horizontal layout, which usually means columns.”

Setting Type on the Web to a Baseline Grid

One of the problems i was having was with the baseline grid, i know the concept behind the baseline, ensuring all the text is consistantly placed and aligned. However i was having problems fiding the correct increments for thebaseline.

I decided on 3pt increments as this allowed it to work well with al sizes of text, from headings to bodytext.

One article i found helpful was by Wilson Miner…

“The main principle of the baseline grid is that the bottom of every line of text (the baseline) falls on a vertical grid set in even increments all the way down the page.”

http://alistapart.com/article/settingtypeontheweb

This link contains pritty much everything on the idea of Grids and Baseline you could need…

http://www.smashingmagazine.com/2007/04/14/designing-with-grid-based-approach/

I decided early on, on a Modular grid system, this would give me the flexibility that i needed as well as the solid structure for a magazine

grid

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s