Backgroundype is a fundamental way ideas are communicated, so type needs to be thoughtfully used. Typography refers to the art and science of letter formation (usually with a computer). Typography communicates the semantic information through the alignment of letters into words but also communicates subtle connotations through visual appearance. Hence the study of typography relates to visual design.
Too often the focus is on the literal meaning of text and little attention is given to shape and form. Landa (1996) suggests several important consideration when designing with type:
Font FamiliesType is composed of a variety of forms, styles, fonts, and families. Family refers to groups of fonts with common elements. For instance a family may consist of different styles, like bold, medium, and light weight, and each may have an italic version.
type as visual formIt is well understood that words are often recognized as a visual whole rather than decoded letter by letter. Type is a visual form so it can incorporate all the related design principles (Lohr, 2003). All the parts of type needs to relate to the other elements so there is a balance of meaning. It needs to be balanced visually in size, weight, position, and orientation. Finally it needs to be balanced in style and colour. Consider type as a graphic element that involves all the principles of visual design.
Serif Type faceSerif type faces have little feet at the ends of the letters. Unbracketed serifs have sharp 90 degree angled serifs and bracketed serifs have curved serifs. Slab serifs are type faces that have horizon and vertical strokes of the same weight.
Sans serifSans serif type faces have no feet on the end of the letters. Often used for headers or titles.
Body copy or Text typeBody copy is the text that makes up paragraphs of text. This must be easy to read. Typically it is 8-12 point size and is sans serif.
Highlighting
ColourRemember some colour combinations create visual dissonance to the point it is no longer legible - it gives you a headache (e.g. bright blue on a purple background).
However, colour can be used to highlight sections or even colour code categories, sections or even the navigation (e.g. web site). If it is difficult to read type when it is not working. Text should be added to enhance meaning and to the message clear.
Terminology
Mixing type facesIt is often better to stay within a type family rather than use different type faces. However, one can combine serif type face for the body copy and sans serif for the headers and titles, this provides a useful contrast (this web site is an example of that). Differentiation is the key but the choices should compliment each other. Too many different type families will confuse and unnecessarily increase the clutter.
HistoryBelow is a video of the History of Typography - interesting background.
|
PurposeGood type matters because it is one of the crucial ways people will process the message.
Creating Mood
JustificationThe justification determines where the text automatically aligns to (e.g. most text is left justified with a ragged right alignment). Occasionally it is okay to mix alignment to create dynamic tension. It is also appropriate to turn on hyphenation if using fully justified text (left and right justified text).
Positioning Text
HierarchyHierarchy is the visual organization of the text. It is how the design distinguishes elements form each other.. It cues the reader as to what to focus on first, second, third, etc. This can also relate to navigation (e.g. web site). The hierarchy should make the organization of information predicable and consistent.
Type can be combined with hierarchical structures to help communicate meaning. Examples of this exist in this web site. For instance, headers are bold in caps and the top of the page, sub headers are all caps and smaller lower on the page. Other sections like quotes or special notes are in boxes and stand out with orange text. These visual clues act as advanced organizers to help viewers organize the concepts they read. Suggestions
Landa has a list of suggestions for effectively using type:
ResourcesThis discussion is just the tip of the iceberg, there is so much more that could be discussed in relation to typography. Below are links to more information on this topic:
Font SitesThere are all kinds of free repositories of fonts for finding those expressive fonts that fit the message.
Further StudyThere are three main aspects of type and the way it communicates, explore these in the following sections:
LegibilityreadabilityExpressive Type Faces |
References
Diemand-Yauman, C., Openheimer, D. M. and VAughn, E. B. (2010). Fortune favors the bold (and the Italicized) (2010): Effects of disfluency on educational outcomes. Cognition (2010), doi:10.1016/j.cognition.2010.09.012, Retrieved Mar. 11, 20111, from http://web.princeton.edu/sites/opplab/papers/Diemand-Yauman_Oppenheimer_2010.pdf
Kristof, R., & Satran, A. (1995). Interactivity by design: Creating and communicating with New Media. Mountain View, CA: Adobe Press.
Landa, R. (1996). Graphic design. Albany, NY: Delmar.
Lohr, L. L. (2003). Creating graphics for learning and performance : lessons in visual literacy. Upper Saddle River, N.J.: Merrill/Prentice Hall.
Saltz, Ina. (2013). Foundations of typography. Lynda.com. Retrieved from http://www.lynda.com/Design-Typography-tutorials/Foundations-Typography/
Kristof, R., & Satran, A. (1995). Interactivity by design: Creating and communicating with New Media. Mountain View, CA: Adobe Press.
Landa, R. (1996). Graphic design. Albany, NY: Delmar.
Lohr, L. L. (2003). Creating graphics for learning and performance : lessons in visual literacy. Upper Saddle River, N.J.: Merrill/Prentice Hall.
Saltz, Ina. (2013). Foundations of typography. Lynda.com. Retrieved from http://www.lynda.com/Design-Typography-tutorials/Foundations-Typography/