Typography

- Kabir Malkani
*

This presentation has been compiled from references available from the Internet. This is
meant purely for educational purposes and the presenter does not claim to hold any
ownership whatsoever; of the content (textual or graphical) included in this presentation.
The ownership and copyrights of the following content belong to the respective brands
/agencies / artists showcased in this presentation.

Topics Covered
O A Brief History
O Introduction to Typography
O Font Anatomy

O Special
O
O
O

O Type Classification

O Terminology

O Font Size
O Weights & Styles
O Letter Spacing (Kerning &
O
O
O
O
O
O

Tracking)
Leading (Line Spacing)
Glyphs
Ligatures
Paragraph Rules
Tabs
Indents

O
O
O

Formatting

Hyphens & Dashes

Line Breaks
Drop Caps
Raised Caps
Typographer Quotes & Inch Marks
Spaces
Boxed Text
Grid

O Best

Practices

O Usage To create Mood

O
O
O
O
O
O

Ligatures
Rag
Widows & Orphans
Choosing a Type
Choosing Pairing Fonts
Typography & the Web

O Examples

of Good Typography

A Brief History
Ancient writing systems

Egyptian
Hieroglyphics
3200 BC AD 400

Sumerian Cuneiform
3000 BC

Greek Alphabet System

800 BC
Still used today as technical
symbols in domains such as
mathematics, science etc.

A Brief History
Gutenberg Bible The 1st Printed book

Written in Latin, the Gutenberg

Bible was printed by Johannes
Gutenberg, in Mainz, Germany, in
the 1450s

Johannes Gutenberg A Replica of the

1398 - 1468
Gutenberg
German Engraver &
Printing Press
Inventor of the
Mechanical Movable
Type Printing Press

A Brief History
Geoffroy Troy Enlightenment & Abstraction
French painter and designer Geofroy Tory believed that the proportions of the alphabet should reflect the
ideal human form. He wrote, the cross-stroke covers the mans organ of generation, to signify that Modesty
and Chastity are required, before all else, in those who seek acquaintance with well-shaped letters.

Geoffroy
Tory 1480 1533
Humanist and
Engraver - His
life's work has
heavily
influenced
French
publishing to
this day.

A Brief History
Early Typographers
Nicholas Jenson was responsible for the development of the first full roman
typeface, which was based on humanistic characteristics and was highly legible.

Nicholas Jenson
1420 1480
Typographer, French
Engraver, Type
Designer

Creator of the Roman typeface

A Brief History
Early Typographers
Aldus Manutius
1449 1515
Humanist, Italian Printer &
Publisher
Aldus introduced small and handy
pocket editions of the classics.
He commissioned Francesco Griffo to
cut a slanted type known today as
italic.
He and his grandson are credited with
introducing a standardized system of
punctuation.
The software company Aldus was
named after him.

Aristotle printed by
Aldus Manutius, 149598

A Brief History
Early Typographers
Claude Garamond
1490 1561
French Publisher, Type Designer & Punch
Cutter

Credited with the introduction of the apostrophe, the accent

and the cedilla to the French language.
He was an assistant to Geoffroy Tory
Several contemporary typefaces, including those currently
known as Garamond, Granjon, and Sabon, reflect his influence.

A Brief History
Early Typographers
Fournier's contributions to
printing were his creation
of initials and ornaments,
his design of letters, and
his standardization of type
sizes
He designed typefaces
including Fournier &
Narcissus

Pierre Simon
Fournier
1712 - 1768
French punch-cutter,
typefounder and
typographic
theoretician..

He also developed a
system of type
measurement, which was
further developed by
Franois-Ambroise Didot
into the point based
system that still exists
today.

Fourniers Type Construction

A Brief History
Early Typographers

William Caslon
1692 - 1766

John Baskerville
1706 - 1775

English gunsmith and

designer of typefaces

English businessman, in areas

including japanning and
papier-mch, but he is best
remembered as a printer and
typographer.

Giambattista
Bodoni
1740 - 1813
Italian typographer, typedesigner, compositor, printer
and publisher.

Introduction to Typography
typography
The term Typography comes from Greek words: typos (form) & graphe (writing)

Definition:
Typography is the art and technique of arranging type in order to
make language visible.
The 3 goals of typography:
O The 1st goal of typography is readability
O The 2nd goal of typography is to transfer information to the reader in an efficient

manner.
O The 3rd goal is to use type to provide a sense of order and structure that

makes logical and visual sense.

Introduction to Typography
Typeface or Font?
O A Typeface is a family of

typographical symbols and

characters.
Helvetica, Bodoni, Futura, Verdana,
Myriad, Arial etc. are Typefaces.
O A Font, on the other hand, is

traditionally defined as a complete

character set within a typeface,
often of a particular size and style.
Myriad Pro Semibold Italic 24 pts,
Futura BdCn BT 18 pts etc. are Fonts

Specimen of the Trajan

typeface

Font Anatomy

Font Anatomy

Type Classification
There are a number of different ways to classify typefaces
and type families. The most common classifications are:
O Serifs vs Sans Serif
O Proportional vs Monospaced
O Technical Styles
O Mood

Type Classification
Serifs vs Sans Serifs
Serifs are semi-structural details on
the ends of some of the strokes that
make up letters and symbols.

Serif typefaces guides the eyes from

letter to letter and are therefore
preferred for body copy in print
documents. The readability of serifs
online has been debated.
Popular serif typefaces: Garamond &
Caslon

Sans Serifs lack such serif details on

characters. Sans-serif typefaces are
more modern in appearance than
serifs. Sans is a French word, which
means without

Sans Serif types are usually used in

magazine headlines and websites for it
is easier to read off the computer
screen. They are also used to attract
attention within a Print Ad for instance.
Popular sans serif typefaces: Helvetica
& Futura

Type Classification
Serifs vs Sans Serifs
Sub-classification of Serifs

Sub-classification of Sans
Serifs

Old Style serifs (also called

humanist)

Grotesque

Transitional serifs

Neo-grotesque

Modern serifs

Humanist

Slab serifs

Geometric

Type Classification
Proportional vs. Monospaced
Proportional typefaces

Monospace typefaces

The space a character takes up is

dependent on the natural width of
that character. An i takes up less
space than an m, for example.
Times New Roman is a proportional
typeface.

Each character takes up the same

amount of space. Narrower
characters simply get a bit more
spacing around them to make up for
the difference in width. Courier New
is a monospace typeface.

Type Classification
By Technical Styles (in chronological order)
Blackletter
Blackletter is the earliest printed type, and
is based on hand-copied texts. It is
traditionally associated with medieval
German / Gothic and Old English.
Dates back to around 1450
Oldstyle
Oldstyle is typified by a gradual thick-tothin stroke, gracefully bracketed serifs, and
slanted stress, as indicated by the red line
through the uppercase O, and as
measured through the thinnest parts of
a letterform.
Dates back to around 1475

Type Classification
By Technical Styles (in chronological order)
Italic
Usually considered a component of the roman
typeface, italic really deserves its own class. italics
are casual as opposed to the more formal roman
forms of a font. Italics are generally used for
emphasis, captions, and the like, and not for body
text. Italics for sans-serifs are often called
obliques.

Script

Dates back to around 1500

Script is a formal replication of calligraphy. As type,
script is unsuitable for a large body of text, but is
widely used to lend a formal element to a layout.
Dates back to around 1550

Type Classification
By Technical Styles (in chronological order)
Transitional
As the name implies, transitional bridges the gap
between oldstyle and modern. It embodies greater
thick-to-thin strokes, and smaller brackets on
serifs. Stress moves to be more vertical.
Dates back to around 1750

Modern
Modern typefaces embodies extreme thick-to-thin
strokes, and hairline serifs. Many modern
typefaces lose readability if set too tight, or at too
small a size, particularly those with strong vertical
stress.
Dates back to around 1775

Type Classification
By Technical Styles (in chronological order)
Egyptian / Slab Serif
Egyptian or slab serif was developed for heavy
type in advertising. It appeared during the
Egyptology craze in Europe. It generally has little
variation in stroke weight and is generally more
geometric, and less calligraphic.
Dates back to around 1825

Sans Serif
Gained popularity as a move towards an
international aesthetic in typography. Sans serif
can be strictly geometric, as in Futura, or more
humanist, as with Gill Sans. More recently, sans
serifs with a variation in stroke weight are
becoming more common (Optima, Myriad).
Dates back to around 1900

Type Classification
By Technical Styles (in chronological order)
Serif / Sans serif
A fairly recent development are families of
typefaces with both serif and sans serif fonts.
These provide the designer with even more unified
variation than an extensive family of serif or sans
serif.
Dates back to around 1990

Grunge
Now part of the common lexicon of typography,
grunge was a development spring from
postmodernism and deconstructionism. Type was
developed as primarily image, and less for its
readability. Grunge typography was a big enough
movement to rate its own category, and
encompasses a wide variety of dirty typefaces.
Dates back to around 1995

Type Classification
By Technical Styles (in chronological order)
Postmodern / Display
Postmodern or Display types encompass a wide
variety of styles and are unsuitable for body text.
Contemporary

Handwritten
Seemingly a contradiction in terms, these fonts
actually can be considered scripts, but their
generally informal nature tends to separate them
out.
Contemporary

Type Classification
By Mood
O

Different typefaces have

strikingly different moods.

Commonly used moods include:

O formal vs. informal
O modern vs. classic/traditional &
O light vs. dramatic.

Times New Roman is a formal font,

and is used for business
correspondence.

Comic Sans, on the other hand, has a

more informal mood and should be
avoided for official correspondence

Terminology
Point size

Terminology
Styles, Weights & Width

Weight

Width

Style

The weight determines how

bold the typeface looks, how
heavy the strokes making up
the characters are.

The width determines how

wide the characters are.

The combination of
properties including
typeface, width and weight
defines the Style of a
font

The traditional weights are

Light, Regular, Semibold, Bold,
and Black

The traditional widths are

Extended, Condensed, Extra
Condensed or Compressed

Helvetica Cnd Obl-Light 24

pts is a particular style that
belongs to the Helvetica
typeface.

Terminology
Letter Spacing
Tracking

Kerning

Kerning and Tracking are the two components of letter spacing.

Tracking defines the
amount of space between
the characters in a word
uniformly regardless of the
characters

Kerning adjusts the space

based on character pairs.
There is strong kerning
between the V and the A,
and no kerning between
the S and the T.

Terminology
Leading (Line Spacing)
This is the vertical space between lines of text. The name comes
from the physical piece of lead that used to be used in mechanical
printing process to separate lines of text

Terminology
Glyphs
Refer to all the available
characters in a font, from
letters to numbers and all
the special characters.

Tahoma Glyph Set accessed

using the Windows Character
Map

Terminology
Ligatures
Two or more letters combined into one character make a
ligature. When parts of the anatomy of characters either clash
or look too close together, they can be combined in what are
called Ligatures.

Common Ligatures are:

fi ligature type, size
12pt Garamond.

Assignment
O Create an artwork which represents at least

principles of Design

discussed in this

presentation
O Choose from projects listed below:
O Ad campaign (series of 3 or more Print Ads)
O Package Design (at least a series of 3 different packaging

samples)
O Brochure Design (for a luxury or consumer brand)
O Web Design (for a luxury or consumer brand)
* Final Date for submitting this assignment is the 31 st of March
2013