KNOWLEDGE NETWORK Design of the external world · paired with Dictionary of Inner Experience → ← All 113 terms

Grid System

A structural framework of rows and columns used to align and organize a layout's content.

In practice

A grid system divides a page or screen into columns, rows, margins and gutters that elements align to. It speeds up decisions, keeps many pages consistent and helps content adapt across sizes. A news website might use a twelve-column grid so a story spans eight columns beside a four-column sidebar on a desktop, then collapses into a single column on a phone.

Often confused with Alignment

A grid system is the framework of columns and rows; alignment is the act of lining elements up, which a grid makes easier.

Try this

Draw a four-column grid on a sheet and lay out a page of text and two images strictly within it.