What Is Typography

Typography is the process of designing, arranging and modifying type. Arranging type involves a number of techniques:changing point size, width, leading, letter-spacing and kerning. Don’t worry if you do not know what these terms are, we will cover them shortly.

The study of typography involves understanding readability and legibility.  A lot of thought goes into choosing the correct techniques to apply to type as it has an effect on the reader. When you are driving down the highway and notice the road signs are all the same font, that’s for a reason.

What Are Typefaces?

Typefaces are a created set of characters of a single size and style. Examples of well known typefaces include: Arial, Helvetica, Verdana, Times New Roman, etc. If you have ever written a paper for school/work you have probably used one of these.

What Are Fonts?

Fonts are specific styles and sizes of a typeface. For example, Arial is a typeface, while a font would be Arial Black 18pts, a specific styling of that type.

What does Sans-Serif and Serif mean?

Serif is a type of typeface that includes serifs. Serifs are the little endings on the end of a letter stroke. If you look at the character below you will notice that there are details at the end, those serifs are what define a serif font. Serif typefaces are primarily used for body text especially in print material as it is considered easier to read. Furthermore, Serif is deemed as a more professional font then San-Serif fonts.

Sans-Serif are typefaces which do not have serifs. These are used more often for headlines, headings and small sections of text. Sans-serifs are considered to be easier to read on computer screens

Typography Terms

Point Size/Height

The point size of a letter is its height. One point equals 1/72 of an inch, therefore size 72 letter is one inch high.  There are twelve points in one pica, another type of measurement; type can also be measured in pixels.

Abbreviations

72 points = 72pts

72 pica = 72p

Width

Width is the set horizontal size of a letter. Some fonts are narrow, while others are wide. Wide fonts are usually called heavy.

Letter-Spacing

Letter-spacing refers to the amount of space between the characters in a word. Increasing or decreasing the letter-spacing can be used to improve legibility by making characters easier to identify.

Kerning

Kerning is often confused with letter-spacing. Kerning is the technique of aligning characters together so they are visually even. A well kerned set of characters has equal horizontal space between characters.

This is just an intro to typography, we will be writing more articles about typography in the future. In the meantime you can check out these other resources for more information.

Further Readings

Thinking With Type – Ellen Lupton

I Love Typography

MyFonts.com

Information on basic design principles, part one of a series of articles providing useful design information. This article covers hierarchy, balance, contrast and proximity.

Hierarchy

Depending on what you want your reader to view first will depend on the hierarchy you have set up. By changing the position of an item on the page, its size or color you can improve your hierarchy.

Hierarchy is a valuable to guide your readers or viewers through your design. Remember to keep in mind what you want your viewers to see first. Without hierarchy your viewers might find it hard to locate important or useful information.

Balance

There are two types of balance: symmetrical balance and asymmetrical balance. Symmetrical balance is achieved through creating equal amount of objects/elements on either side of an ‘imaginary line’ separating the  page. Asymmetrical balance is achieved by balance through different techniques.

For example pretend you are weighing your page on a scale. Different elements will weigh different weights based on their size, and content. As you can see below although there is a lot of text on one side by placing a design element  of equal weight on the other side you can balance the design.

Contrast

Contrast goes beyond differences in color, it can be applied to size, texture, type and more. By providing contrast you can add interest to your design. Increasing contrast can improve readability by making type stand out.

Proximity/Clustering

Individual design elements that are grouped together are perceived as a group. By increasing the proximity of similar objects in your page you can help your viewers locate similar information.

I would love to see how you have applied this techniques to your designs. Leave a comment and share you work with others!