Grid Types

Various types of grids exist and are used within all types of visual design. With the creation of the printing press, bookmakers developed a manuscript-style grid, or a block grid, to bring structure to text on pages. Within news design, the column grid allowed publishers to break the page apart into sections to emphasize different pieces of content.

Similar to news design, the most common type of grid a web designer will use is the column grid. The column grid breaks up a page into vertical units that span the width of the content, and this grid structure can dictate how elements are laid out with precision and elegance.

Let’s continue to explore the anatomy of a grid and what it comprises.

Instructions

Examine the diagram in the right view. Note how the columns span the web page evenly on the horizontal axis. By using a column-based layout, it allows designers to evenly space content horizontally while seeing how their layouts stack vertically.