Typography basics

1. 10 Typeface Basics

2. Glossary 1
Ascenders:Ascenders: Strokes of letters that rise above the mean line of type (b,
d, f, h, k, l, t).
Descenders:Descenders: Strokes of letters that fall below the baseline (g, j, p, q,
y)
x-height:x-height: The height of the main body of the lowercase letters. Most
sans serifs have large x-heights.
2

3. Glossary 2
Type families (sometimes referred to as font):Type families (sometimes referred to as font): Versatile faces such as
Garamond, Franklin Gothic, Futura, etc. offer several variations of weight
and posture in the same typeface.
Display type:Display type: Point sizes 14 point and above.
Width rule:Width rule: When copy gets too wide, readability drops off. The rule is
that copy should be no wider than an alphabet and a half or 39 characters.
3

4. Measuring Type
1. Type is measured in points.
2. 72 points = 1 inch,
3. 72-pt. type is 1 inch tall,
measured from the top of the
ascenderascender to the bottom of the
descenderdescender.
4. ½-inch = 36-pt.
5. ¼-inch = 18-pt.
6. No letter has both an ascender
and a descender; however in
any given typeface and size, the
length of the ascender and
descender are the same.
4

5. Type Anatomy
5

6. Tip #
1. Pair personality to purpose.
• Keep in mind the message you are trying to
communicate with your type.
• Sports, even women's sports, do not lend
themselves to feminine script, for example.
Getting down, dirty girls rugby gaining popularity
Or
Getting down, dirty girls rugby gaining popularity

7. Tip #
2. When working with type, more
type families are not better.
• Limiting type to no
more than three font
family for the entire
book is a growing trend.
• When combining type
for headlines, remember
two’s company, three’s a
crowd.
• Limit spread designs to
one distinct type
supported by something
simple.
A family of fonts is
composted of different
stylesstyles.

8. Font #
1: Reading pull-down information
Format of font
1. TrueType
2. Postscript
3. Open Type (best)
Format of font
1. TrueType
2. Postscript
3. Open Type (best)
Styles of font
in family
1. Light
2.
Condensed
Styles of font
in family
1. Light
2.
Condensed
Font Family
Myriad Pro
Font Family
Myriad Pro

9. Font #
2: Classifications of font families
6 basic font
classes
1.1. SerifSerif
A. Old Style
B. Transitional
C. Modern
D. Slab Serif
2.2. Sans SerifSans Serif
(sans = without)
3. Script
A. Blackletter
3. Display
4. Monospaced
5. Dingbat

10. Font #
3: SerifsSerifs
• SerifsSerifs are easier toeasier to
readread than sans
serifs.
• Use a serif fontserif font for
body copybody copy (text), as
a general rule.
SerifsSerifs are in red
Baskerville
Bernhard Modern
Courier Standard
Garamond
Georgia
Minion Pro
Palatino
Times New Roman
Examples Of Serif Fonts:Examples Of Serif Fonts:

11. Font #
4: Sans serifsSans serifs
 These are lessThese are less
legible thanlegible than
serifs.serifs.
 UseUse sans serifsans serif
fonts forfonts for
primaryprimary
headlines orheadlines or
captions as acaptions as a
general rule.general rule.
Examples of
Sans Serif Font Families
Arial
Arial Rounded MT
Comic Sans MS
Futura
Helvetica
Letter Gothic Std
Lucia San
Myriad Pro
News Gothic MT
Stone Sans ITC TT
Verdana

12. Font #
5: ScriptScript
ScriptScript fonts are
• harderharder to read.
• used as largelarge text
only.
• for special casesspecial cases
only.
Bickham Script Pro
Brush Script Std.
Caflisch Script Pro
Dickens Script SSK
Edwardian Script ITC
Handwriting — Dakota
Lucida Blackletter
Lucida Handwriting
Medici Script
Old English Text
School House Cursive
Snell Roundhand
Examples Of Script Font Families:Examples Of Script Font Families:

13. • harderharder to read
• used as largelarge text only
• for special casesspecial cases only
Examples Of Display Families:Examples Of Display Families:
DisplayDisplay fonts are:

14. Font #
6: Display FontsDisplay Fonts
• harderharder to read
• used as largelarge text only
• for special casesspecial cases only
Abite
Air Conditioner
Bionic Comic Bold
BowlORama
Big Apple
Doris Day
Lucifer’s Pension
Jellyka Castle’s Queen
JI Toy Train
Raconteur NF
Sand

15. Font #
7: Monospace FontsMonospace Fonts
MonospaceMonospace
fonts
Are also called
"fixed pitch" fonts
Have characters that
all have the same
character width
Originally were
designed for
typewriters
Used with computer
source code
Andale Mono
Courier New
Letter Gothic Std
Lucinda Console
Lucinda Sans Typewriter
Monaco
ORC A
Prestige Elite Std
Examples Of Monospace Families:Examples Of Monospace Families:

16. Font #
8: Dingbat FontsDingbat Fonts
DingbatDingbat
fonts are:
Also known as a "printer's
ornament" or "printer's
character.”
Describe fonts with symbols
and shapes in the positions
designated for alphabetical or
numeric characters.

17. Font #
9: Dingbat FontsDingbat Fonts
GlyphsGlyphs are:
An ornament, a character or spacer used
in typesetting.

18. Font #
10: Dingbat FontsDingbat Fonts
MT Extra abc fde g
MS Reference Specialty ABCDE
Symbol αβχδεφγ
Type Embellishments One LET abcdefg
Webdings 
Wingdings 
Wingdings3 
Zapf Dingbats
Typical Examples Of Display Families:Typical Examples Of Display Families:

19. Font #
11: Dingbat FontsDingbat Fonts
AbecedarianZoo abcdefg
AmphibiPrint abcdefg
Carta abcdefg
Face it! Abcdefg
Face Off!Abcdefg
RoadSign abcdefg
RoadWarningSign abcdefg
Fun Examples Of Display Families:Fun Examples Of Display Families:

20. Font #
12: RememberRemember
The more unusual the type,
the lower the readability.
Pick your fonts carefully.

21. Tip #
3. Avoid using all capitals.
• That doesn’t mean you can never use all caps.
• Just realize all capital letters reduces
readability.
• Use all caps only when you have a specific design
purpose in mind.
• Especially avoid using all capitals in a script face.
• Your readability drops to about zero.

22. Tip #
4. Pay attention to relationships
when combining type.
• If elements are not the
same, they should be very
different.
• Remember, like the perfect
marriage, types need to
either be very similar or
fairly opposite.
• Contrast type in size,
weight, form and structure.
• The combinations you form
should communicate, not
confuse the reader.
Examples:
Verdana bold for heads
Georgia for text
= good contrast
Verdana bold for heads
Trebuchet for text
= not enough contrast

23. Tip #
5. Some types just don’t mix.
• Don't use two scripts or a script and an italic
together.
• They usually have the same form and so theythey
conflictconflict with each other rather than contrast.
• Never use two types from the same category (for
example: Script, Decorative) together.
Don'tDo
Don'tDo

24. Tip #
6. Don’t abuse type through manipulation
• Purpose is to communicate type helps do that.
• Don’t manipulate type to fit your design by adjusting
leading and width.
• Instead, edit the copy or find a word that fits the
headline space.
• Once established within a section, type size, leading
and width should remain consistent.

25. Tip #
7. Complement your knowledge of
fonts with your knowledge of
design.
• Use of effectively planned white
space and color can enhance your
use of type.
• Place type on the page to create
entry points for your reader.

26. Tip #
8. Learn more from the experts.
• Magazines like Before & After and
Dynamic Graphics have
information and advice.
• Check out books like The Non-
Designers Design Book by design
experts like Robin Williams.
• Many of these tips come from her.
• For more technical information,
check out her Non-Designers Type
Book.
• Browse the bookstores and stock up
on magazines that use type
effectively so you can build a library
of ideas.