VOICE OF TYPE LECTURE 1 TYPOGRAPHY II COUNTY COLLEGE OF MORRIS PROFESSOR GAYLE REMBOLD FURBERT
VOICE OF TYPE As you look at typefaces, analyze their forms, learn their history and learn how to use them in layouts, you will expand your ability to make type speak in expressive ways. 2
Objectives To observe how type expresses ideas and feelings To identify the anatomy of letterforms To describe how type families work To learn about faux type styles To understand letterform proportion To review typographic terms 3
Can you hear type? Spoken language doesn t express ideas and feelings with words alone. The tone of the voice, volume and the speed of delivery impacts the message. Written communication can t use these means of expression. Typographic design gives voice to words. 4
Example 1: You can see two different settings of the same word? Which conveys a stronger warning? 5
Example 2: Which typeface inspires confidence in the doctor s professionalism? 6
Which typeface works best for a Western Steak House? Which for a wedding invitation? Which might work well for a party invitation? Which reflects the Jazz Age of 1920 s 7
Expression Cadillac s use of script font embodies their motto of elegance and sophistication. Google is the benchmark for stability and reliability, the serif font has a calming effect. Disney s display font has proven to become one of the most recognizable and boldest logo s in the world. Hulu s logo is a bold modern font with a progressive edge needed to capture the attention of users. 8
Psychology behind type choices 9
Anatomy of Letter Characters 10
Terminology There is a standard set of terms to describe the parts of a character. These terms and the parts of the letter they represent, are often referred to as letter anatomy or typeface anatomy. With this understanding, designers can better understand how type is created and how to use it effectively. 11
Baseline The baseline is the invisible line on which characters sit Baselines may differ from typeface to typeface Rounded letters may extend slightly below the baseline X-height Is determined by the height of a lowercase x. This height can vary greatly between typefaces. 12
Meanline The meanline is determined by the x-height of a typeface Cap Height The cap height is the distance from the baseline to the top of uppercase letters 13
Ascender The part of a character that extends above the meanline is the ascender. Descender The part of a character that extends below the baseline is the descender, such as the bottom stroke of the letter 14
Serifs Fonts are often divided into serif and sans serif Serif fonts are distinguishable by the extra stroke at the ends of the character, known as a serif 15
Stem The stem is often the main body or stroke of a letter The vertical line of the letter B and primary diagonal line of letter V are stems Bar Bars are horizontal or diagonal lines of a letter, also known as arms, and are open on at least one side 16
More terms Bowls: open or closed circular line, creates an interior space, such as in c and b. Counter: the open or closed inside of a bowl. Leg: the bottom stroke of a letter, such as the base of an L or diagonal stroke of a K. Shoulder: the curve at the beginning of a leg of a character, such as in an m. 17
More terms Axis of Stress: the direction of an implied line that passes through the thin parts of the round shapes in letters. Bracket: a curve from the serif to the main stroke. Swash: decorative extensions at the beginning or end of a letter. Ligature: two or more letters redesigned to join together into a compound character; this is usually done to avoid clumsy fitting between characters. 18
Type Family: Variations on the theme 19
Fonts Font refers to the encoded information that describes the entire typeface and the digital files that contains this information. OR A complete set of type of one size and face, which includes letters, numbers, and punctuation, that shares a common design or style. } Each of these is a specific font. 20
Type Families Refers to a set of related typefaces that share a common name Different styles are available within a typeface, such as roman, bold and italic. Times New Roman and Helvetica are examples of type families. 21
Styles Italic Italic type is at an angle, generally slanting to the right from bottom to top. Italics usually refer to serif typefaces. Oblique usually refer to sans serif typefaces. Bold Bold, or boldface, type is a heavier weight than roman type. Bold is often referred to as black or medium, or other names depending on the weight. 22
Styles continued Light Light type is thinner than the roman option. Depending on how light the type weight is, it will often be used at large sizes so it is legible, or to achieve a specific style. As with bold, there are light varieties such as ultralight. 23
Styles continued Extended Extended type is wider than the standard type of a family. Useful for headlines/large type areas. It provides even greater flexibility within a family. Condensed Condensed type is a narrower face, which can fit into small spaces. It provides more style options while staying within the same family. 24
Combined styles Most type families will not just provide bold, italic, condensed, light, and so on, but combinations of each. This gives the designer even more options to work with. Example: Helvetica Neue: regular, italic, bold, bold italic, light, light italic, ultralight, ultralight italic, condensed bold and condensed black. 25
Combined styles continued Combined style options within a type family, and the combinations of each, allow designers to achieve a harmonious layout while using a variety of styles. These type families are extremely useful because a designer can use just one or two within a project, but still have a wide variety of styles to choose from. Combined styles help achieve a consistent design. 26
Don t Faux It! 27
Faux Faux (pronounced foe ) a French word that means false or fake. Applications have the option of styling a regular font into a faux bold or italic. This is technically incorrect and may not print correctly. Faux styles destroy the integrity of the form and structure of beautiful typefaces. 28
Letterform Proportion 29
Four major variables impact letterforms 1. Stroke-to-height ratio: a change in the weight and appearance of the letterform occurs when the ratio of stroke width to letter height is produced. 2. Contrast-in-stroke weight: changes in the contrast between thick and thin strokes alter the optical qualities of the letterform. 30
Four major variables impact letterforms 3. Expanded and Condensed styles: qualities of the typographic font change dramatically when the widths of the letters are expanded or condensed. EXPANDED CONDENSED 4. X-height and proportion: relationships between the x-height and capital, ascender, and descender lengths influence the appearance of letterforms significantly. 31
Tracking, Kerning and Letterspacing 32
Tracking, Kerning and Letterspacing The distance between characters is controlled by tracking, kerning and letterspacing. Tracking adjusts the space between characters across a block of text. Kerning reduces space between individual characters. 33
Tracking, Kerning and Letterspacing Letterspacing is the addition of space between characters. These precise adjustments are used to tweak a specific word, such as in a logo design, or a large headline. Leading is interline spacing and is measured in points, from one baseline to the next. A block of text may be referred to as being 12pt with 6pts of extra leading, also known as 12/18. 34
Chapter Summary This chapter introduced the idea that type expresses feelings. It included basic vocabulary to describe the anatomy of letters and the use of typographic terms. You became familiar with type families, letterform proportion, and the problem with faux type styles. 35