Class 2

typography and communication design lesson 02 & 03

the faces of type • type anatomy• type families• type classification• brief history

anatomy

Double chin?

Big feet?

Bowed Legs?

“ you just want me formy body”

Tall & Curvy?

type

little details will tell you alot about your type.

GO AHEAD AND CHECK THEM OUT.IT’S NOT SHALLOW.

IT’S YOUR JOB.

More than any part of the body, the x-height can dramatically affect the type readability. Avoid extremely of very large x-heights if that is important to you.

ASCENDERQuite ambitious, this part of a lower case letter rises above the x height.

SET WIDTHWidth of a character in relation to the height. Being wider than you are tall isn’t always a bad thing.

X-HEIGHTThe height of a lower

case x of the height of lower case letters.

CAP HEIGHTThe distance between the baseline and the top of a capital letter. BASELINE

The imaginary, yet crucial line where all obedient letterforms sit.

COUNTERThe enclosed negative space within a letter.

DESCENDERThe male anatomy of a lower case letter that hangs below the baseline.

TERMINALEven though it sounds life-threatening, it is just the endpoint of the letterform.

A font consists of a set of character of consistent design.

A font family extends this to become a set of fonts, designed to work together.

A family consist of the variations (styles) of the basic font.

The names of the variations or styles are not consistent, and alternatives are given with the descriptions.

The most basic variations are bold and italics. Most well-designed fonts have at least these. The family may consist of more.

Here are some of the most common.

familiestype

ROMANAlso called ‘book’, ‘normal’, ‘regular’. The normal form of the typeface, the term comes from early type being derived from Roman inscriptions.

ITALIC (OBLIQUE)Italics are a less formal version of a typeface, derived from 15th-century italian handwriting. It is important to recognized the difference between true italics, which are designed as a separate but consistent face, and obliques, which are more like what you get when u click the italic button in a word processor: pushed over roman. Oftentimes the italic version of sans-serif type is called oblique, so the confusion deepens.

BOLDFACEBold, black, heavy, poster. A thicker stroke weight than the roman form. Bolds are proportionally thicker. Depending on the thickness, there are variations such as semi-bold, medium, demi-bold, ultra-bold, black, extra-bold, super, or poster.

Avant Garde BookHelvetica RegularMinion Pro Regular

Avant Garde Book ObliqueHelvetica ObliqueMinion Pro Italic

Avant Garde BoldHelvetica BoldMinion Pro Bold

LIGHTThe opposite of bold, light has a thinner stroke weight than roman. Again, there may be levels and naming variations such as ultra-thin, thin, and ultra-light.

CONDENSEDSometimes termed ‘compressed’, this is a horizontally thinner version of a typeface. May have its own variations in stroke, such as ultra-light condensed.

EXTENDEDA horizontally extended version of the roman, again may have stroke variations. Much more common with sans-serif families.

Avant Garde Extra Light

Helvetica BoldFutura Std Light

Avant Garde Book CondensedUnivers CondensedFutura Std Condensed

Univers Extended

Helvetica ExtendedEurostile Extended

A basic system for classifying typefaces was devised in the nineteenth century, when printers sought to identify a heritage for their own craft analogous to that of art history.

Humanist letterforms are closely connected to calligraphy and the movement of the hand. Transitional and modern typefaces are more abstract and less organic. These three main groups correspond roughly to the Renaissance, Baroque, and Enlightenment periods in art and literature.

Designers in the twentieth and twenty-first centuries have continued to create new typefaces based on historic characteristics.

classificationtype

Type classification, while helpful, is often confusing and even controversial.

Type classification is also helpful in pairing typefaces for projects, sometimes based on historical proximity but also by noting similar features that unify the typefaces, such as axis or x-height.

In some cases, by finding enough disparity in the small features, very different typefaces become complementary.

Part 1: Classifying Serif Typefaces

Part 2: Classifying Sans Typefaces

Part 1ClassifyingSerif TypefacesHumanist / Old-Styled / Transitional / Modern / Slab Serif

Humanist faces were very calligraphic in nature

• Notable calligraphic influence, patterned after handwriting.

• Sloping “e” crossbar.

• Relatively small x-height.

• Strongly angled axis or stress.

• Inconsistent stroke weight.

• Low contrast between thick and thin strokes.

• Based on typefaces designed in Renaissance cultural hubs such as Venice.

Humanist (mid 1400s)

Old-Style (late 1500s – 1700s)

The serifs become more carefully formed, and characters are

designed more proportionately

• Less calligraphic influence because type began to be viewed as separate from writing.

• Axis or stress but less angled.

• Larger x-height compared to Humanist type.

• Increased difference between heavy and light strokes.

• Named after influential type designers Claude Garamont and Aldus Manutius.

Transitional (mid 1700s)

• No calligraphic influence. Designed independently, sometimes on a grid.

• Visually vertical axis or stress.

• Serifs are less bracketed and flatten out.

• High contrast between heavy and thin strokes.

• First appeared in the late-17th century.

Details become very refined

Modern (1800s – 1900s)

• Extreme contrast between thick and think.

• Rigidly vertical axis or stress.

• Apertures (the place where character opens) are generally very tight.

• Poor choice for chunks of text.

• Work best at large sizes.

• Named after Firmin Didot and Giambattista Bodoni.

Very precisely designed.

Slab Serif (1800s)

• Created for advertising, posters and large media.

• Easiest to identify because of their obvious appearance.

• Very heavy weight.

• Low contrast between thick and thin.

• Unbracketed, prominent serifs.

• First typefaces created expressly for display purposes.

No-nonsense Attitude.

EXERCISE 2

Here’s a little exercise to test your comprehension of what we’ve covered so far.

Take a look at these specimens and comment on how you’d classify them.

Keep in mind that classification is an aid, rather than a hard and fast system.

1

What? Why?

2

What? Why?

3

What? Why?

4

What? Why?

5

What? Why?

6

What? Why?

Part 2ClassifyingSans TypefacesGrotesque / Neo-Grotesque / Humanist / Geometric

Grotesque (1800s)

The capital G in a Grotesqueis usually spurred

• Early, original Sans Serifs

• Variation in the thickness of strokes.

• Tall x-height.

• Examples of the Grotesque category include Franklin Gothic, Monotype Grotesque and Schelter Grotesk

Neo-Grotesque

Created with an emphasis on neutrality and simplicity

• Also known as Transitional or Realists.

• Much more refined than the Grotesque.

• Less variation in the line weight.

• Often a single-story “g”

• Tight apertures.

• Examples of the Neo-Grotesque category include Universe, Helvetica, Arial, Bell Gothicand DIN.

In 1957, a big year for Neo-Grotesquesans serifs, as Frutiger’s Univers as well as Folio were released.

Haas Foundry released Max Miedinger’s Neue Haas Grotesk, which drew heavilyon Schelter and Akzidenz Grotesks.

In 1960, Haas, in an effort to market it more effectively, rebranded Neue Haas Grotesk to what we know as one of the most ubiquitous typefaces of all time...

HELVETICA

Many people love Helvetica so much that they’ll hang prints of vintage Helvetica specimens as decoration.

Humanist

• Humanist sans even feature some stress, and nearly all other sans serifs have a completely vertical axis.

• Much higher stroke contrast.

• Often two-story lowercase “a” and “g”.

• All of these characteristics combine to make most Humanists a more legible choice than other types of sans faces.

• Examples of the Gill Sans, Frutiger, Myriad, Trebuchet and Calibri.

Humanist faces were very calligraphic in nature

Geometric

• Geometric lineals are among the least legible of sans serifs and are usually suitable only for display type.

• Usually show little or no stroke contrast

• Often a single-story lowercase “a”

• Examples of the Futura, ITC Avant Garde,Century Gothic, Gotham and Spartan.

They are built ongeometrical shapes

History ofTypography

video

Examples: Posters created using Bodoni Typeface (Modern)

EXAMPLES > MODERN

• Style development in the late 18th through 19th Century.• High contrast between thick and think strokes.• Flat serifs.• Some may be more difficult to read.• Later... slab serifs / square serifs / related to Clarendon style with

less contrast and softer, rounder shapes.• Examples of fonts: Bodoni, Didot, etc.

Examples: Posters created using Bodoni Typeface (Modern)

Examples: Posters created using Didot Typeface (Modern)

Examples: Posters created using Garamond (Old-style)

EXAMPLES > OLD-STYLE

• Developed by Renaissance typographers to replace the Blackletter style of type.

• Low contrast between the thick and thin strokes, bracketed serifs, and a left-leaning axis.

• Carried to evolved from 16th through 17th century.(At this point it was called Transitional typefaces)

• Examples of fonts: Garamond, Goudy, etc.

Examples: Posters created using Goudy Typeface (Old-style)

Examples: Posters created using Baskerville, Calson, Georgia (Transitional)

EXAMPLES > SERIF

• Have the little tail found at the tip of the alphabet.• Hairline - much thinner than the main strokes, very very thin lines.• Square(slab) - thicker than hairline serifs all the way up heavier weight than

the main strokes.• Bracketed - curved transition between the serif and the main strokes.• Unbracketed - attached directly to the strokes of the letterform, sometimes

abruptly/at right angles.• Examples of fonts: Baskerville, Bodoni, Calson, Georgia etc.

Examples: Posters created using Rockwell (Modern)

EXAMPLES > SLAB SERIF (A Sub-classification of modern style)

• Evolved from the Modern style.• Square and larger, bolder than the older serifs• Examples of fonts: Clarendon, American Typewriter, Rockwell

Examples: Posters created using Clarendon Typeface (Modern)

last but not least...

infogood to know

The quick brown foxjumps over the lazy dog

The above panagram is extremely useful for designers to choose typefaces. It consists of all the 26 alphabets and shows the characteristic of a type at one glance.

meaning: A panagram (Greek: pan gramma, “every letter”), or holoalphabetic sentence, is a sentence using every letter of the alphabet at least once.(source: wikipedia)

SEE YOU IN THE NEXT LESSON

THANK YOU