Uma grelha é uma estrutura de linhas utilizada para alinhar elementos de design. Divide uma página em colunas, linhas e margens, fornecendo ao designer um sistema para posicionar o conteúdo. O designer suíço Josef Müller-Brockmann codificou os princípios da grelha na década de 1960, e o seu livro "Grid Systems in Graphic Design" continua a ser uma referência padrão. Os jornais, revistas e sites utilizam grelhas, embora de formas diferentes.

Uma grelha típica possui colunas, espaçamento entre colunas e margens. As colunas contêm o conteúdo. O espaçamento entre colunas separa as colunas. As margens delimitam a página. Uma grelha de 12 colunas é comum na web porque divide o conteúdo igualmente em metades, terços, quartos e sextos. Os designers podem utilizar várias colunas para conteúdo mais amplo ou uma única coluna para texto estreito. A grelha não dita o design. Fornece uma estrutura que o designer pode seguir, adaptar ou quebrar deliberadamente. Quebrar a grelha pode ser impactante. Uma imagem que ocupa toda a página e ignora as colunas chama a atenção precisamente por violar a estrutura.

Componentes da grelha

• Colunas: faixas verticais para conteúdo.
• Caleiras: espaços entre colunas.
• Margens: margens externas do layout.
• Grelha de linha de base: linhas horizontais para alinhamento do texto.

Uma grade não é uma gaiola. É uma ferramenta para tomar decisões mais rapidamente e manter um layout coerente em várias páginas ou ecrãs.