Design Practice: Grid System Research

Grid Systems

In graphic design, a grid is a structure which is usually two-dimensional, and it is made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure a content. A grid system is a framework that is supposed to help the graphic designers in the logical and consistent organisation of information on a page. Graphic designers have started to build a rigid and coherent system for page layout. Grid systems are an established tool that is often used by print and web designers to create well structured and balanced designs.

They enable the graphic designer to organise whatever content they are working with consistently onto a page, using any combination of margins, guides, rows and columns. Grid systems are commonly seen in newspaper and magazine layouts with columns of text and images. Grids can also be used across an entire project so that the structure is consistent throughout. The gird will not be noticed once the finished product has been printed, but before print, it enables a consistent design to be produced. When starting a project, using a grid system will help position the elements of your design on a page.

"The grid system is an aid, not a guarantee. It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice." - Josef Muller-Brockman

Single column grid - the most simple grid consists of a single column of text surrounded by margins. Layout programmes encourage you to design your page from the outside in. These work well for more simple documents.
Spreads - books, magazines and newspapers should be designed in spreads (facing pages).
Multicolumn grid - these provide flexible formats for publications that are more complex, some that integrate text and illustration.

Anatomy of grids: Depending on the content that they will contain, grids vary in size, shape and complexity. However, every grid is made up of the following parts:

Margins: The space that separates the content from the edge of the page.
Flowlines: Alignments that break the space into horizontal bands.
Columns: Vertical divisions of space on a page.
Rows: A series of flowlines that create horizontal divisions of space on a page.
Gutters: Space that separates rows and columns or two facing pages.
Modules: Individual units of space created from intersecting rows and columns.
Spatial Zones: Groups of modules that cross multiple rows and columns.

Types of grids:

Rule of thirds

There are several types of grid systems a designer can use. The simplest method is to use the rule of thirds. This consists of dividing a page into thirds with two equally spaced vertical/horizontal lines so that the important compositional elements can be placed along these lines or intersections. This is commonly used in photography.

Golden ratio

The golden ratio is another popular method (approximately 1.618) for proportioning. The ratio has been studied by mathematicians. It has been used for centuries by architects, artists and book designers for its aesthetically pleasing qualities.

Baseline grid
A baseline grid is commonly used in publications such as newspapers and magazines, the page is divided into several equal sized columns. This consists of a set of horizontal lines on a page, the baseline of all type sits on this.

There are two main types of layout within graphic design, vertical and landscape. There are also only two types of grids. One has an even number of columns and one has an odd number. These diagrams below found online present examples of layouts using basic layout grids.

Vertical grids