Basics

Question 0

Sans serif

Answer 0

Without serifs

Question 1

Serif

Answer 1

Small line tailing from the edges of letters

Question 2

Script

Answer 2

• Mimics handwriting/calligraphy, great for adding human element
• not good for body copy
• comic sans is script not sans serif, never be used for body copy or ever

Question 3

Humanist serif

Answer 3

• emulates classical calligraphy
• some contrast in stroke
• traditional, classic
• journalism or historical applications

Question 4

Transitional serif

Answer 4

• much sharper serif
• more contrast between thick and thin strokes
• strong/stylish/dynamic feel
• traditional academia & legal applications

Question 5

Modern serif

Answer 5

• thin, horizontal serif
• very high contrast between thick and thin strokes
• structured/elegant feel
• arts and cultural applications

Question 6

Egyptian (slab serif)

Answer 6

• Heavy boxy serifs
• low contrast in the stroke
• authoritative, yet friendly feel
• marketing and promo applications

Question 7

Humanist sans serif

Answer 7

• emulates calligraphy
• minimal contrast between strokes
• use in govt, finance, educational
• (verdana)

Question 8

Transitional sans serif

Answer 8

• upright, uniform characters
• strong strokes
• unassuming, modern feel
• tech/transportation applications

Question 9

Geometric sans serif

Answer 9

• Geometric shapes from the backbones of letters
• strict, objective, modern feel
• science/architecture

Question 10

2 rules of mixing typefaces

Answer 10

• don’t use 2 typefaces if the same style (ex. Humanist serif and humanist serif) too similar
• don’t use two fonts of the same class (ex. Humanist serif and slab serif) too difficult to choose 2 serifs or 2 sans that complement eachother

Question 11

When mixing 2 typefaces DO

Answer 11

• find a similar trait
• (ex. Humanist serif and humanist sans)
• or designed by same person, similarities in chronology, visual details

Question 12

Define Leading
Effect of leading on readability
What size should leading be
Define baseline

Answer 12

• Amount of space in between text, measured baseline to baseline
• good leading is 120-150% of body copy - CSS line height: 1.5
• leading too large negatively affects readability, user gets lost. Too small leading makes user claustrophobic
• Baseline- where the majority of the letters end besides y,g,etc (descenders)

Question 13

line width:
Define CPL
How many CPL’s is ideal?
Controlled in CSS using?

Answer 13

• characters per line
• 50-70 cpl including spaces is ideal
• controlled in CSS using max-width

Question 14

Type size:
What is suggested body copy font?
What percentage of the body copy should the heading, bhead, navigation, and byline be set at?

Answer 14

-Body copy font set to 16px
-heading should be 200-300% of body copy
-generally b-head set at 150%
Navigation at 100% (same as body copy)
By-line is 75% of body copy or 2-4px