Good design is based on an invisible grid – a group of non-printing guides for the framework of a page.
While some designers feel a grid may limit creativity, it may be just the opposite. When used correctly, the grid helps with balance, brings order to chaos, and improves alignment. It gives organization and structure to a page, whether it’s for a flyer, brochure, web page, or PowerPoint slide.
It compartmentalizes the information and helps to guide the reader’s eye from starting point to ending point, conveying the information in the most effective way.
In the example above, we used 5-column, 10-row modular grid to bring a fresh look to the layout. As you can see, the main elements used in any grid system are margins, guides, columns, and rows.
If you’re just starting to learn about grids, consider the popular grid used by many designers and photographers – the rule of thirds grid. It’s a 3-column, 3-row grid where the idea is to position important elements in the grid along the lines, or at the points where the lines intersect, to provide visual interest.
If you’ve ever read a book, you’re already familiar with the manuscript grid. Also known as a block grid, it’s the simplest kind of grid: mainly a large rectangle that takes up most of the space on a page and may have single columns with varying widths, and the margins can be expanded in order to create unexpected interest on the page. It’s also a good format for a long essay.
Another popular grid used in design is the column grid. A column grid is made up of a varying number of vertical columns. The widths of the columns are typically based on the amount of the running text. The most common column grids are typically made up of two, three, or four columns. The grid works well for posters, websites, and other design projects that need flexibility in the design. In addition, many newsletters typically have two columns and a variety of rows which are based on the headline, main image, main text, and a call to action.
The next most popular grid is the modular grid. This grid has consistent horizontal divisions from top to bottom in addition to vertical divisions from left to right. The lines in the grid serve as guides where all elements can be anchored and is a good choice for complex design projects and layouts that require more control than a column grid can offer.
The last grid is a hierarchal grid, similar to a modular grid but without consistently spaced divisions. Instead the grid is based upon the size and relevance of the elements on a page and how much emphasis you want drawn to each element. The hierarchical grid works best on websites and design projects that require intuitive placement of elements.
In order to use grids, first decide upon the margins of the page. This creates breathing room on the outside edges of the page. Next, determine the print area where all of the design elements will be placed. If the design has a lot of text, create column widths that will support 9 to 12 words per column. As you get more familiar using and experimenting with grids, you’ll be able to determine quickly how many columns and rows will be needed and which grid will work best.