VOICE OF TYPE - Typography

transcript

TYPOGRAPHY II COUNTY COLLEGE OF MORRIS PROFESSOR GAYLE REMBOLD FURBERT

VOICE OF TYPE L E C T U R E 1

2 TYPOGRAPHY II – COUNTY COLLEGE OF MORRIS

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.

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

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.

Example 1:

• You can see two different settings of the same word?

• Which conveys a stronger warning?

Example 2:

Which typeface inspires confidence in the doctor’s professionalism?

• 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

Expression

Cadillac’s use of script font embodies their motto of elegance and sophistication.

Disney’s display font has proven to become one of the most recognizable and boldest logo’s in the world.

Google is the benchmark for stability and reliability, the serif font has a calming effect.

Hulu’s logo is a bold modern font with a progressive edge needed to capture the attention of users.

Psychology behind type choices

Anatomy of Letter Characters

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.

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.

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

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

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

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

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”.

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.

Type Family: Variations on the theme

Font refers to the encoded information that describes the entire typeface and the digital files that contains this information.

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.

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.

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.

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.

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.

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.

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.

Don’t Faux It!

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.

Letterform Proportion

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.

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.

4. X-height and proportion: relationships between the x-height and capital, ascender, and descender lengths influence the appearance of letterforms significantly.

EXPANDED

CONDENSED

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.

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.

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.

VOICE OF TYPE - Typography

Documents