1. Typography - Effectively using type through careful consideration of font choice, size, style, spacing etc. 2. Hierarchy - Creating a clear visual hierarchy through techniques like size, weight, placement to guide the viewer. 3. Contrast - Using contrast in color, size, style etc. to make certain elements stand out. 4. Alignment - Aligning elements for a neat, organized look that is visually pleasing. 5. Proximity - Grouping related design elements closely together and separating unrelated elements.

1. Typography

2. Topics Covered
O A Brief History
O Introduction to Typography
O Font Anatomy
O Type Classification
O Terminology
O Font Size
O Weights & Styles
O Letter Spacing (Kerning &
Tracking)
O Leading (Line Spacing)
O Glyphs
O Ligatures
O Paragraph Rules
O Tabs
O Indents
O Best Practices
O Special Formatting
O Hyphens & Dashes
O Line Breaks
O Drop Caps
O Raised Caps
O Typographer Quotes & Inch Marks
O Spaces
O Boxed Text
O Grid
O Usage To create Mood
O Ligatures
O Rag
O Widows & Orphans
O Choosing a Type
O Choosing Pairing Fonts
O Typography & the Web
O Examples of Good Typography

3. What is typography?
•Typography: The study of all elements of type including the
shape, size and spacing of the characters
•Typography plays an important role in the audience perception of
your document or project and its information
•Typography helps to create “information relationships” in two
ways:
•By the organization of your information
•Keeping things interesting through the use of fonts, letters
and symbols

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

5. 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 man‟s 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.

6. A Brief History…
Nicholas Jenson
1420 – 1480
Typographer, French
Engraver, Type Designer
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.
Creator of the Roman typeface

7. A Brief History…
Early Typographers
Aldus Manutius
1449 – 1515
Humanist, Italian Printer &
Publisher
„A
ristotle‟ printed by
Aldus Manutius, 1495-98
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.

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

9. A Brief History…
Early Typographers
Pierre Simon
Fournier
1712 - 1768
French punch-
cutter, typefounder and
typographic theoretician..
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
He also developed a system
of type measurement, which
was further developed by
François-Ambroise Didot into
the point based system that
still exists today.
Fournier‟s Type Construction

10. A Brief History…
Early Typographers
Giambattista Bodoni
1740 - 1813
Italian typographer, type-
designer, compositor, printer and
publisher.
William Caslon
1692 - 1766
English gunsmith and
designer of typefaces
John Baskerville
1706 - 1775
English businessman, in areas
including japanning and papier-
mâché, but he is best
remembered as a printer and
typographer.

11. Introduction to Typography
ty·pog·ra·phy
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.

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

13. Font Anatomy

14. Font Anatomy

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

16. Type Classification
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.
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 serif typefaces: Garamond & Caslon
Popular sans serif typefaces: Helvetica &
Futura
Serifs vs Sans Serifs

17. Type Classification
Transitional serifs
Modern serifs
Slab serifs
Neo-grotesque
Humanist
Geometric
Serifs vs Sans Serifs
Sub-classification of Serifs Sub-classification of Sans Serifs
Old Style serifs (also called humanist) Grotesque

18. Type Classification
Proportional 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.
Monospace typefaces
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.
Proportional vs. Monospaced

19. 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-to-thin
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

20. Type Classification
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.
Dates back to around 1500
Script
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
By Technical Styles (in chronological order)
Italic

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

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

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

24. Type Classification
Handwritten
Seemingly a contradiction in terms, these fonts actually
can be considered scripts, but their generally informal
nature tends to separate them out.
Contemporary
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

25. Type Classification
By Mood
O Different typefaces have strikingly
different moods.
O Commonly used moods include:
O formal vs. informal
O modern vs. classic/traditional &
O light vs. dramatic.
O Times New Roman is a formal font, and is
used for business correspondence.
O Comic Sans, on the other hand, has a
more informal mood and should be avoided
for official correspondence

26. Terminology
Point size

27. Terminology
Styles, Weights & Width
Style
The combination of properties
including typeface, width and
weight defines the “Style” of a
font
Helvetica Cnd Obl-Light 24 pts is
a particular style that belongs to
the Helvetica typeface.
Weight
The weight determines how bold the
typeface looks, how heavy the
strokes making up the characters
are.
The traditional weights are Light,
Regular, Semibold, Bold, and Black
Width
The width determines how wide the
characters are.
The traditional widths are
Extended, Condensed, Extra
Condensed or Compressed

28. Terminology
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.
Letter Spacing
Tracking
Kerning

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

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

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

32. Assignment
O Create an artwork which represents at least 5
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 31st of
March 2013