Layout Grid

A layout grid is an invisible framework of columns, rows and fixed spacing against which text, images and buttons are aligned. It produces calm, recognisable pages and makes layouts predictable, because elements follow defined positions instead of being placed freely.

In practice

You can spot a missing grid without any design training: edges do not line up, spacing looks arbitrary, and every subpage looks slightly different. A consistent grid saves money later, because new pages are assembled from existing blocks instead of being designed from scratch. Make sure the grid collapses sensibly on a phone, where a three-column view becomes a single column and the reading order still has to make sense. A fixed spacing scale, usually multiples of one base value, is just as important so that spacing is not renegotiated for every element. The common mistake is designing the grid for the homepage and abandoning it on forms and text pages.

Matching service

← Back to the glossary