Reading Time: 3 minutes

aligning textUsing type well increases the amount of content read on your site. Type is all about detail.

First, select a typefaces that works well on screen. You shouldn’t need more than two or three. Ensure the smallest font used is legible.

Even when deciding something as minor as how to align text, there are design principles that will improve readability. Once known, you can follow these, with rigid consistency!

Fully Justified is Tidy… but Unreadable

This is where lines of text line up on both left and right.

not aligning text fully justified

For body copy: word spacing can vary so much, that ‘rivers’ of whitespace appear between the text. This is very distracting. In addition, those with dyslexia will hate you for it.

For headlines: vary font size from line to line. Often used on TV headlines, it looks tidy but again… very awkward to read.

In Most Cases, Left Works Best

Left aligned paragraphs deliver a straight left edge.

This anchors readers, so they know where the next line will start each time. This means paragraphs are read faster, increasing the number of articles that are likely to be read.

aligning text left or centre

Is it OK to Right or Centre Align?

With both right aligned and centred text, the reader faces the same issue: dealing with a varied starting position for each line. There’s no consistent place to move your eyes to, when locating the next line:

  1. It forces visitors to work harder to continue reading
  2. It slows down reading, when completing each line
  3. It discourages long-term engagement and ‘deep reading’.

For just one or two lines, such as headings or captions this can work. It requires limited eye movement to scan, without slowing down the reader too much.

Aligning Images with Text

With centred images within a grid, centre captions to add symmetry. However, as with body text in general, if your image is right aligned, still left align text unless it is a short caption.

Combining Headlines and Body Text

When you combine a centred headline with a left aligned paragraph, the unsymmetrical line lengths of the paragraph will make the headline appear slightly off-center.centered-headlines
Similarly a left aligned heading, will lose the symmetrical appearance of a paragraph with centred text.

Pair centred headlines with centred paragraphs and left aligned headlines with left aligned paragraphs.

Follow these rules and you can’t go far wrong.

If it’s easy to read, more people will read it