In Information Design

Principles of Information Design: Grid Systems

As environmental designers, many of the projects we take on involve lots of information, and it’s our duty to organize, simplify and make it functional. One way to do so is by using grid systems to layout information in a clear and concise structure.

Professor Edward Tufte, an expert in the field of information graphics, stated that “clutter is a failure of design, not an attribute of information.” It’s our job as designers to unclutter information and present it to viewers in way that is easy to understand and digest. If you take a look at a newspaper, magazines or even well-designed websites, you’ll start to notice grid structures used to organization the information.

The use of grid systems is a foundational principle that most graphic design students learn in their design programs. When I was in school we had three or four classes in the first year alone devoted to the use of grids. It’s an idea that can be hard for young designers to grasp, the idea of a rigid structure can hinder creativity. However as designers mature and gain experience they’ll start to realize how to use the grid to their benefit and even break it when necessary.

Grids Provide Organization

The primary function of a grid is to provide an organizational framework in which to lay out copy and images, as well as grouping related information where necessary. When a grid is used consistently across multiple pages of a magazine layout, brochure or website, it provides a familiar structure that helps viewers process information more easily. Consistent structure enhances usability and accessibility to information.

Grids Facilitate Movement

Whether an exhibit or a newspaper, designers can use grids to move the viewer through a piece. By varying spacing between elements, compartmentalizing information, and breaking out of the grid when necessary, designers can control the flow of large amounts of information. In controlling the flow, we can direct the viewer’s eye through the information and therefore enhance the scanning of content.

Getting Started

Grids can be as simple or complex as you need them to be. They can be simple geometry, such as a three-column by five-row grid, or more subtle, such as a consistent amount of space between elements. Always consider your content — both copy and images — and find a solution that works for the content and the medium. A great place to start is the Golden Ratio, a mathematical formula for determining size relationships. The Golden Ratio is found repeatedly in nature as well as art and design, so it will help create a structure that is both familiar and comfortable for viewers.

Grid systems are only one of many important principles to information design. Throughout the next few months we’ll be talking about more Principles of Information design, so keep an eye out for more entries in the series!

About The Author

Photo of Ryan Lascano

Ryan Lascano

Ryan is an environmental graphic designer masquerading as a web designer, with experience in branding and advertising, but trained in traditional print design. He is also the editor and creator of Arrows & Icons Magazine.

Discussion: One Response

Leave a response below.

You can follow any discussion of this article via the Comments RSS feed.

  • ali hong kong said:

    In web design columns are often dynamic and variable height, so horizontal considerations (to control flow) are difficult to control.

    In web design, the 960 px grid (960.gs) is a great rapid development framework utilising grids, and the many-times divisible 960 pixels size.

    September 18, 2009 at 12:43 am

Leave a Reply