General Typographic Principles

crowdone The web is for print! Well, type actually. Of all the media choices possible for distance or electronic learning, the written word remains the most flexible, compact, easily interpreted, and simplest form to produce method for communicating simple and complex ideas. However, the written word in electronic form requires special considerations for use, so that the media does not obscure the meaning. Some of these considerations are classical print rules for legibility and readability carried over to a new medium, while others are unique to electronic communications.


Typeface vs. Font

Many people, even those that are experienced with graphic or text design, often use the words typeface and font interchangeably. Though closely related, these words are not interchangeable. Typeface describes the structure of the letter family “Arial” and “Times” are typefaces. Font refers to the size of the typeface. Each size must be slightly altered to represent the stresses and thickness of elements of a typeface, so each font set is more than just a resized typeface, but, when referring to “font”, we mean size.


Legibility

Legibility is the ease of which a short passage or phrase of text can be understood. Take the heading above this paragraph, for example. Is it clear? Does it require you to concentrate on each word, or does its meaning make itself apparent without strain?

Legibility can be achieved through the choice of font types, size, spacing, type color and background color choices. These choices depend a great deal upon the work of which they are a part, but a few generic rules can be applied to most situations to increase legibility.


Use Fonts Without Serifs

Serif fonts have extra flourishes of strokes at their extremities. While this is comfortable while viewing longer passages, such as this text, it is less comfortable on the eye for short sections of text, such as a title or header.


Use Colors that Contrast Sharply

The use of contrasting colors for the headers make them stand out from the background, thus making them easier to read.


Use Variable Capitalization

We recognize words as shapes as much as read them. Our minds anticipate sentence structure and emphasis from capitalization. Capitalization in headers gives distinction to each word, which imparts meaning more readily to our brains.


Readability

Readability is similar to legibility, except that it applies to large amounts of text. The text that you are reading at this moment is an example of readable text. It is made more readable by using a serif font, a color contrasting successfully with the background color, and an appropriate font size.


Use a Serif Font

For longer blocks of text, use a serif font to improve readability. This may seem counter intuitive, but the presence of serif fonts is so prevalent in modern mass-media, such as newspapers and novels, that it is a comfortable font for us to read.


Use Contrasting Colors

Light text on a dark background, or dark text on a light background will make the text most readable. Avoid light text on a light background, dark text on a dark background, or colors between the text and background that are too similar, such as shades of the same color.

This is an example of light on dark text.

This is an example of dark on light text.

This is an example of using analogous colors.


Avoid Thick or Thin Font Types

For the majority of your written text, avoid using heavy or light fonts, as these are more difficult to read.

This is an example of a thick font.


Attempt to Maintain Consistent Spacing

It is advisable to maintain consistent word and line spacing for blocks of text, as this helps the reader easily slide over the text without distractions. People typically read line-by-line, so an easy transition between words and lines of text is essential to readability.

This is an example of widely-spaced letters.

This is an example of closely-spaced letters.


Attempt to Maintain Consistent Line Length

Reading blocks of text that are fairly consistent in word length and size are easier due to consistency for the reader.


None of This May Actually Apply

These rules are primarily for traditional print, and as such, may not even apply to electronic media types, though it is probably best to attempt to apply them when designing content. They may not apply for the reasons that your design requirements might specifically require you disregard them, or the end-user may simply over-rule their application. In electronic media types, unlike print media, the user often can apply local preferences to text such as changing the size, font, or weight of the text, depending upon the interface used to access the material.

This means that, unlike with print media, your design may need to be more flexible, in case the user wishes to customize their access to it, in order to satisfy their needs. If they are viewing your text through a web interface, and you are complying with basic accessibility standards, then their choices for how the text is displayed is more up to them than you.

Keep this in mind when you are designing electronic media, and try and test those possibilities that are obvious, such as use-determined font changes and sizes, to see if your design choices hold up.






Return to Top