Graphic Design Typography Flashcards

24 sample cards from the Typography deck

Sampled from the end of the deck, so these are different cards from the ones shown on the syllabus page.

1. When should you increase tracking, and by roughly how much?

   Increase tracking for text set in ALL CAPS or small caps (commonly about $5\%$–$10\%$ of the em, e.g., 50–100 units per 1000 in design apps), and slightly for very small type or reversed (light-on-dark) type, where letters tend to visually close up.

2. Why is tight (negative) tracking risky for small body text?

   At small sizes letters need more room, not less: negative tracking makes letterforms touch or merge (e.g., rn reading as m), destroying word shapes and legibility. Tight tracking is safer at large display sizes, where default spacing looks loose.

3. What is leading, and what is the origin of the term?

   Leading (line spacing) is the vertical distance from one baseline to the next. The term comes from metal typesetting, where strips of lead were inserted between lines of type to add space.

4. What is the recommended leading for body copy relative to type size?

   Typically $120\%$–$145\%$ of the point size, i.e., $\frac{\text{leading}}{\text{type size}} \approx 1.2\text{–}1.45$. For example, 10 pt type on 12 pt leading (written 10/12). Web body text commonly uses a line-height around $1.5$.

5. What does it mean for type to be 'set solid', and how do measure and leading interact?

   Set solid means leading equals the point size (e.g., 12/12), leaving no extra space between lines. Longer lines (wider measure), larger x-heights, and sans-serif faces all need more leading so the eye can find the start of the next line.

6. What are 'rivers' in typeset text and what causes them?

   Rivers are distracting vertical or diagonal channels of white space running down a paragraph, caused by coinciding oversized word spaces — most common in justified text on a narrow measure without hyphenation.

7. What are the two standard ways to signal a new paragraph, and what is the key rule about combining them?

   Either a first-line indent (traditionally $1$ em) or extra vertical space between paragraphs — but not both, since each alone is sufficient. Convention also says the first paragraph after a heading needs no indent.

8. How wide should a normal word space be, and what happens when word spacing is too loose or too tight?

   Roughly $\frac{1}{4}$ em — about the width of a lowercase i. Too-loose word spacing breaks lines into fragments and creates rivers; too-tight spacing makes words run together, forcing the reader to work to separate them.

9. What is typographic hierarchy, and how do headings and subheadings create it?

   Hierarchy is the visual ordering of content by importance so readers can scan and navigate. Headings establish it through contrasts of size, weight, color, case, spacing, and placement — e.g., H1 largest/boldest down through progressively smaller subheads.

10. According to the proximity principle, how should vertical space around a subheading be distributed?

    A subheading must sit closer to the text that follows it than to the text above it, so it is visually grouped with the content it introduces. Equal spacing above and below makes the subhead float ambiguously between sections.

11. What are typical point/pixel sizes for body copy in print and on the web?

    Print body copy is usually 9–12 pt (10–11 pt is common); on the web, about 16 px is the standard minimum for comfortable reading, often larger for long-form text.

12. How are captions typically styled relative to body copy, and what is their role?

    Captions describe images, tables, or figures and sit at the bottom of the type hierarchy. They are set smaller than body text (often 1–2 pt smaller) and differentiated by italic, a weight change, or a secondary typeface, while remaining legible.

13. What is a modular typographic scale, and what is its formula?

    A modular scale generates harmonious type sizes by repeatedly multiplying a base size by a fixed ratio: $f_{n} = f_{0} \times r^{n}$, where $f_{0}$ is the base size and $r$ is the ratio. Common ratios: $1.25$ (major third), $1.333$ (perfect fourth), $1.5$ (perfect fifth), and $\varphi \approx 1.618$ (golden ratio).

14. List the common font weight names and their corresponding CSS numeric values.

    Thin 100, Extra Light 200, Light 300, Regular/Normal 400, Medium 500, Semibold 600, Bold 700, Extra Bold 800, Black/Heavy 900.

15. State the core rule of typographic contrast when differentiating two text elements.

    If two elements are not the same, make them clearly different — combine multiple cues (size and weight, or weight and color). Timid, barely perceptible differences (e.g., 12 pt vs 13 pt) look like a mistake rather than deliberate hierarchy.

16. What is the classic guideline for pairing typefaces in a design?

    Pair for contrast, not conflict: combine typefaces that differ clearly in classification — most commonly a serif with a sans-serif (e.g., serif body with sans headings) — while sharing compatible proportions (similar x-height). Avoid pairing two similar faces from the same category.

17. What is a type superfamily, and why is it useful for pairing?

    A superfamily is a set of typefaces (e.g., serif, sans, slab, mono versions) designed on shared skeletons and proportions — such as Merriweather/Merriweather Sans or IBM Plex. It guarantees harmonious pairing because contrast in style comes with identical underlying structure.

18. How many typefaces should a typical design use, and how do you create variety within that limit?

    Limit a design to 2–3 typefaces. Create additional hierarchy using variations within each family — weights, italics, sizes, and caps — rather than adding more fonts, which fragments the design.

19. What is the measure in typography, and what is the ideal range for a single-column line?

    Measure is the length of a line of text. The comfortable range is $45$–$75$ characters per line (including spaces), with about $66$ characters considered ideal (Bringhurst); multi-column settings can drop to $40$–$50$ characters.

20. Give a quick rule of thumb relating type size to measure in picas.

    Set the measure at roughly twice the point size expressed in picas: $\text{measure (picas)} \approx 2 \times \text{point size (pt)}$ — e.g., 12 pt type on about a 24-pica line. (Recall $1\ \text{pica} = 12\ \text{points} \approx \frac{1}{6}$ inch.)

21. Name the four basic text alignments and the standard choice for long body text in Latin scripts.

    Flush left (ragged right), flush right (ragged left), centered, and justified. Flush left is the standard for long-form reading because it keeps word spacing even and gives a consistent left starting edge; centered and flush right suit only short passages.

22. What problems does justified text cause, and what conditions make justification acceptable?

    Justification forces variable word spacing, producing gaps and rivers on narrow columns. It works acceptably only with a sufficiently wide measure (about 60+ characters) and hyphenation enabled; otherwise use flush left. Also check the rag of flush-left text for awkward shapes.

23. Define widow and orphan in typesetting.

    A widow is a short last line of a paragraph (or a lone word) stranded at the top of the next column or page — or, loosely, a single word on a paragraph's final line. An orphan is a paragraph's first line left alone at the bottom of a column or page. Both break reading flow and should be eliminated.

24. What techniques fix widows and orphans?

    Slightly adjust tracking or word spacing, edit/rewrite the text to change line count, force a line or column break, use a nonbreaking space to pull a word down, or enable keep-options (e.g., 'keep lines together', widow/orphan control set to at least 2 lines).

What this deck covers

Typography flashcards FAQ