wordsby1910

Between the Lines

wordsby1910:

Since we wrote about grids and how we work with typography, a few people have asked us why we tend to place text between (or sometimes straight on) the baselines, rather that on top of them. There are two main reasons for this which we’ll quickly explain below.

image

The first reason is that if we want to keep a consistent vertical distance between objects above and below the text while still aligning those objects to the grid, placing the text on top of the lines would make this impossible, as shown below.

image

Placing the text between the lines instead will keep the vertical distances equal, or at even multiples of the baseline height, while still keeping all objects perfectly aligned to the grid.

image

The other reason is that if we use buttons or similar objects which contains text within the shape, we want both the shape itself and the text inside of it to align to the grid. By placing the text either between (or straight on) the baselines this can be achieved, as shown in the first column, while placing it on top of the baselines would either misalign the text from the button shape (column 2) or the button shape from the grid (column 3).

image

That pretty much sums it up! If you have any input on the subject, feel free to drop us a mail or give us a shout on twitter. The original article on grids from typography can be found here.