What is a grid?

A grid breaks space or time into regular units…Typographic grids are all about control. They establish a system for arranging content within the space of a page, screen or built environment.
— Ellen Lupton, Thinking With Type

Why use one?

  • Helps break up “White Space”
  • Gives order, structure to chaos
  • Helps proportional relationships
  • Overall polish (amateur vs pro)

Why use one for web design?

Website design uses many of the same design principles as print. The grid is just one tool borrowed from print design. The other key ingredients of great design:

  • Use of white space
  • Use of typography
  • Use of color
  • Image use


Grids In Web Design

1140 Grid – Link
“The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser.Beyond a certain point it uses media queries to serve up a mobile version, which essentially stacks all the columns on top of each other so the flow of information still makes sense.”