RSS Feed
Mar 5

Design for the Times: Legibility

Posted on Thursday, March 5, 2009 in Design Tips, Desktop Publishing, graphic design

Here’s a fact to face: the American population is aging and eyesight is one of the first things to go. It starts with squinting, moves to headaches, and finally the reality of the situation becomes apparent – it’s time for glasses, contacts, or even lasik surgery.

Statistics show that people over 50 are not only the fastest growing group of Americans, but they are also a tech-savvy bunch that are taking over the likes of Facebook and other social media networks. 50 years old is typically when eyesight begins to wane. So, how do we accommodate this group in terms of legibility? If they can’t read our blogs and websites, brochures and catalogs, then we can expect to miss out on a staggering portion of the population.

Printed packaging materials and even websites are cramming more information into view. The result is that font sizes tend to shrink and text tends to bleed over onto images. This can wreak havoc on individuals who have a difficult time seeing. In fact, if text on a graphic does not have strong enough of a contrast, then the reader may not even see the text!

The solution is twofold: better font selection and stronger contrasts. Fonts can still be small, but some fonts are easier to read than others when small. Text on images are fine so long as the text stands out clearly from the background.

Font Selection:
Some fonts are better when you have to use small type. You don’t necessarily have to use large fonts to improve legibility, but selecting fonts designed for legibility at small sizes will dramatically help. For example, in the 1960s, Roger Excoffon designed a font family called Antique Olive specifically for legibility:

antique-olive 

Another font that works very well in small type is Palatino. Fortunately, most computers come loaded with Palatino so you can be sure that web users will be seeing the font you intended:

palatino 

Antique Olive is a sans serif font, meaning that there are not any flags or small design elements that connect the letters visually. Palatino is a serif font – you can see the small flags and tags on the top of the letter “T”, the bottom of the “q”, and so on.

Strong Contrast:
Another important tip to help with legibility is to use strong contrasts when text is on top of a graphic or background other than white. Here’s an example of a low contrast that many readers may not even be able to see:

lowcontrast01
 
An easy way to dramatically improve legibility is to add a stroke to the text of these images. Here’s an example of the same font with the same colors and a 1pt stroke around the letters.

stroke
 
Ideally, you should use colors that have a strong contrast. If you need to work with colors within a certain range that’s fine, but find as strong a contrast as possible and use a stroke if necessary:

 lowcontrast03

 

Conclusion:
Don’t isolate a huge part of your potential customer base by making your website or print design difficult to read. A little legibility goes a long way, and with the proper font and color selection you can dramatically improve your content.

Bring on the comments

  1. G F Mueden says:

    We seem to have a common interest. Daily I receive, in print and on my computer screen, material that is hard to read because it is in small type or presented with such low contrast that I can read it only by resorting to time wasting and inconvenient procedures.

    Today it was Reuters headlines in skinny pale blue on a white screen and the VNSNY with gray ink on shiny white paper.

    I would like to refer these to an expert in the field of legibility to grade them and return them to the senders with critiques and suggestions for improvement.

    I have spoken of this to Dr Aries Arditi, Lighthouse International’s expert in the field, and he understood my need, but his job is research and he has no time for advocacy.

    I have been searching for legibility testing, grading, and standards without success. How to produce good legibility is well known, but there is no way for producer to know how legible it is an a grading system and be able to say, e.g., that this sample can not be read easily by “x” percent of the population. You can’t go out on the street and ask a thousand people “Is this easy to read?”, and there are too many factors involved to analyze it at your desk.

    What might work and I would like to see it done, is to have a catalog of real examples, judged by a lot of people (thousands) that tells for each example the percent that found it easy to read. Other examples could be compared to those in the catalog for an estimate of its legibility. This suggestion is far from perfect, but would be better than nothing.

    I have in mind a way of building such a catalog. Create an ungraded catalog and have the samples graded by a large sample of the population. Keep doing it until you can make a close prediction of the results that will come in the next batch. Then you will have a set of graded sample against which other samples can be compared.

    It can be done with a one sheet of examples, that would be tested by each individual where he does his work or reading with whatever light and whatever glasses he normally uses, and the only thing he does is to mark each example as OK or Not OK. The results will be our grading standard.

    It ought to be done. Maybe it has been done. Somewhere in the government’s depths, beyond my ability to search, the problem may be under study. The National Eye Institute? I hope so.

    Any ideas out there on how it can be done or who is doing it?

    gfmueden@verizon.net

  2. Ex Back says:

    After reading through this article, I feel that I need more info. Could you share some resources ?

Leave a Reply