typefaces and legibility

Work with me to get the immediate benefit of 20 years' experience in strategy, copywriting, design, development and publishing.

InTouch24-7 creates affordable sales, training and community websites that work!  We provide fixed quotes for projects, so you don't go over budget. We create prototypes, so you know exactly what you will get!

Let's brainstorm! I offer a FREE 30 minute consultation to discuss your website objectives.

Legibility is good design

Are you involved in approving the design of marketing material? Knowing some solid facts and figures about legibility will help you keep creative people on track.

Well edited Content

Your website should have text content that is clear, simple, and impossible to misunderstand. The goal is to be read, not admired by your 9th grade English teacher! Get rid of…

  • complex sentences
  • uncommon words
  • specialized terminology (other than keywords)
  • a writing style that alienates people – or bores them
  • statistical terms, figures or graphs that are easy to misinterpret
  • ambiguous statements
  • unattributed quotes or statements

Choosing typefaces

Fonts are divided into two main categories – Serif vs San-serif typefaces. Serif typefaces have “short lines” at the end of the letters (i.e. serifs); San-serif typefaces are the modern faces, and do not have them.

Serif faces work best for legible print – people are used to reading newspapers and books which have serif faces. The serifs in fact help the eye to define the letters quickly. I always you serifs on long, technical documents. I prefer a serif typeface on my Kindle, even though it is an electronic device.

San-serif faces work best in electronic media – websites and presentations. This is because serifs tends to be curves – and diagonals on screen become jagged. The more “square” the typeface (like Tahoma), usually the better it looks on screen.  In print, san-serif typefaces are associated with elegance and technology.

There is a compromise – Slab. My headlines are in a “slab” font. It has serifs that make it easy to read. But the 90 degree angles of the serifs make it legible on screens.

Improving layout readability

Use graphics: 98% of people start reading from a photograph. Therefore don’t confuse the reader – have one dominant image on a page. Don’t waste audience interest on meaningless stock graphics in key areas. Yes, a world map is cool, but unless it says something about your company it’s a waste of that all-too-short reader attention span.

Captions are the second-most important object; say something interesting (and preferably about your core competence) in the caption. But don’t be obvious – tell him something more than what he can see for himself.

Subheads and bold text help the reader along and keep him reading – make them interesting. Quotes (in boxes or different colour/size text) also add interest.

White space illuminates the story – don’t “fill it in” with words and photographs. Build white space into your design.

Don’t ignore gravity. Layouts, like books, should move from top left to bottom right. Most humans are used to that direction. We like it that way. So keep to the same principles in your design. But if you market in the far east, or Israel, you may have to adapt to some new directions.

Be consistent: whatever colours, fonts, text sizes, banners, borders and justification you choose, keep it the same throughout the publication or website unless there is a good reason for changing it. I always use templates to ensure consistency.

Using colour

Don’t use too many colours – less is best. And don’t use colour for its own sake with bullets, rules, bars etc. It is not there to decorate the page – it is there to sharpen the message.

Use colour to link separate elements. See how I used the blue headlines in the text – it helps to create a cohesive design.

White space. Any colour should be surrounded by plenty of white (or in a website, the background colour) to bring it out. The larger the tinted background area, the lighter the tint should be and the bigger/bolder the type on top of it.

Headlines – if you’re really looking for readability, use charcoal on white – it is not too contrasty. Be careful of colours that “vibrate” together such as orange with royal blue, or red with emerald green.

Avoid mixing pastels (or muted colours) with bright primaries – it seldom works. And even if your personal taste runs to the exotic, remember your readers or viewers may be more traditional.

More on this topic