Professional Documents
Culture Documents
TYPOGRAPHY PRIMER
Ë
TYPOGRAPHY PRIMER
Ë
What’s in a Letter x-height
Every serious subject has a language of its own. Typography is Traditionally, x-height is the height of the lowercase letter x. It affects
no exception. The following diagram shows a few terms used to the feel of a typeface, how many characters fit on a line, and
talk about letterforms. Many more appear in the Glossary of depending on how the type is set, how easily your text can be read.
Typographic Terms at the end of this document. These terms let At very small point sizes, a font with a larger x-height is easier to
you discuss type like an expert. read, everything else being equal. Compare the following examples
Hfgx
of Adobe Jenson,™ Utopia,® and Minion,® all at a point size of :
ascender
cap You can’t really talk about type without talking about x-height.
height x-height Simply put, x-height is the height of the lowercase letters,
baseline excluding the ascenders and descenders. Unlike point size, x-height
descender
is not a unit of measurement. Rather, it’s a proportional description
of the lowercase letters. A typeface with a large x-height simply
means the lowercase letters are proportionally large in relation to
Serif and Sans Serif the ascenders and descenders.
The serif, or cross-line at the end of a stroke, probably dates from Adobe Jenson 10-point type / 13-point leading (10 /13)
early Rome. Father Edward Catich proposed in his seminal work,
You can’t really talk about type without talking about
The Origin of the Serif, that the serif is an artifact of brushing letters x-height. Simply put, x-height is the height of the
onto stone before cutting them. Serif types are useful in text because lower-case letters, excluding the ascenders and
the serifs help distinguish individual letters and provide continuity descenders. Unlike point size, x-height is not a unit of
for the reader’s eye. measurement. Rather, it’s a proportional description
of the lowercase letters. A typeface with a large
Serifs come in many styles. Compare the tapered serifs of Kepler® x-height simply means the lowercase letters are
to the slab serifs of Chaparral® and the wedge serifs of Warnock.™ proportionally large in relation to the ascenders and
descenders.
Kepler Chaparral Warnock Utopia 10 /13
You can’t really talk about type without talking about x-height.
Simply put, x-height is the height of the lowercase letters,
Typefaces without serifs are called sans serif (sans is French for
excluding the ascenders and descenders. Unlike point size,
without) designs. The first sans serif type design is credited x-height is not a unit of measurement. Rather, it’s a proportional
to William Caslon in England in . Sans serif designs are also description of the lowercase letters. A typeface with a large
sometimes referred to as gothic or grotesque designs. x-height simply means the lowercase letters are proportionally
large in relation to the ascenders and descenders.
Myriad Cronos Ocean Sans
®
® ™ Minion 10 /13
Today, most of the digital type used on computers is designed to to skip a line when scanning to find the next one.
be proportionally spaced. With proportional spacing, each letter is 11-point type / 24-point leading (11 / 24)
given just the amount of space it needs to look right and be most
Too little leading creates dark, uninviting color
legible. Using a proportional font, you can fit much more text on a that may cause the eye to skip a line when scanning to
page than using a monospaced font while at the same time making find the next one. Too much leading causes the eye
to jump from line to line and is disruptive to reading.
the text easier to read.
11 / 11
Line Length
As lines of text get long, it can be difficult for the reader to move
from the end of one line to the beginning of the next. On the other
hand, short line lengths break up the text and interrupt the reader.
The ideal line length depends on the design of the typeface, type size,
line spacing, and length of the copy. Generally, a line should have
to characters, or to words, for optimal readability.
AVOID
spacing to vary. Each letter is designed with just the
amount of space it needs to look right and be most leg-
ible. Watch that word spaces don’t create awkward gaps
or rivers. They are disruptive to comfortable reading.
Task Toolkit 118 Choose a column width, typeface, and point size that
work to enhance readbility.
Task Toolkit 118 More consistent word spacing, better typographic color
Using the Right Character What to do with capitals in your text? small capitals
The difference between an amateur-looking document and a are the best solution. If they aren’t available, reduce the
professionally produced one can be a matter of details. The following point size of the full-size capitals slightly and letterspace
topics cover some of the most commonly overlooked or incorrectly so they aren’t crashing into each other.
Small capitals
handled details of typography.
Italics, Boldface, and Uppercase What to do with CAPITALS in your text? SMALL
CAPITALS are the best solution. If they aren’t available,
Unless you’re indicating text that is hyperlinked, you should avoid
reduce the point size of the full-size CAPITALS slightly
underlining text. Underlining is left over from typewriters, which and letterspace so they aren’t crashing into each other.
lacked italics. Sometimes underlining is necessary when no adequate Reduced size capitals
Warnock Pro Caption Adobe sells a number of expert-set typeface collections. These
collections contain many of the less frequently used characters that
add a professional look to your documents, including oldstyle
Warnock Pro Reg (text) figures, small capitals, ornaments, and ligatures. For example, you
can use f-ligatures, which eliminate awkward character combina-
Warnock Pro Subhead tions. Compare the fi, fl, ff, ffi, and ffl ligature combinations in the
second line with the individual characters in the first line.
1234567890 easier to read than right aligned text. Avoid right alignment unless
it is appropriate as a design treatment. Justified text aligns on both
Uppercase numerals Lowercase numerals
the left and right hand sides and is used in newspapers, newsletters,
These numbers, 123 and These numbers, and and traditionally in book work. Justified text is sometimes
456 or 789 and even 0, or and even , set in considered more formal than ragged text. Not surprisingly, it
set in uppercase look too lowercase work much better optimizes the amount of copy you can fit on a page.
large in text. with text.
The alignment of text within text blocks contributes
Small Capitals to the tone of your documents. When text is aligned to
one margin and ragged on the other, it can create
Smaller versions of regular capital letters, called small capitals or
an informal feeling. Left aligned text is easier to read
small caps, are drawn to have the same typographic color as the
Left aligned
lowercase characters in a typeface, and to be visually appealing when
used alongside lowercase text. The alignment of text within text blocks contributes
Some applications allow you to apply a small-capitals style to your to the tone of your documents. When text is aligned to
text. This usually means that the application reduces the point size one margin and ragged on the other, it can create
of full caps to about the height of the lowercase. The resulting letters an informal feeling. Left aligned text is easier to read
are usually too light, even if the application does something like Right aligned
expanding the type horizontally. Small capitals are useful for section
The alignment of text within text blocks contributes to the
headings or chapter titles, to accent important words or phrases in tone of your documents. When text is aligned to one mar-
mid-sentence, or at the beginning of a paragraph for a lead-in. True gin and ragged on the other, it can create an informal feel-
small caps are one sign of a truly professional typesetting job. ing. Left aligned text is easier to read than right aligned text.
Justified
Small Capitals vs
FAKE SMALL CAPITALS
TYPOGRAPHY PRIMER 9 www.adobe.com/type
Copyfitting Choosing and Using Typefaces
Copyfitting is the process of deciding which typeface, point size, With literally thousands of typefaces readily available it would be
leading (line spacing), and line length are necessary to fit a certain logical to ask “How do I go about choosing (and using) the best
amount of text into a given space. With careful planning, these typeface—or combination of typefaces—for my publication?”
choices need only be made once, at the beginning of a job. Unfortunately, there’s no simple and quick answer to this question—
It is important to understand how each of these choices affects the choice of what’s best will vary with several factors, including the
readability. In general, text becomes less readable as the typeface intended audience and their aesthetic values, the tone or attitude
becomes too condensed or too extended, point size becomes you’re trying to convey, the medium you’re designing for, and the
smaller, leading becomes tighter, or line length becomes longer. content of the publication.
The following guidelines give only a very brief overview of a
In general, text becomes less readable as the typeface becomes too condensed
complicated and subjective topic—entire books have been
or too extended, point size becomes smaller, leading becomes tighter
dedicated to it. But if you combine the following guidelines with
(that is, when the line spacing is reduced), or line length becomes longer.
your own aesthetic values and common sense you’ll probably avoid
In general, text becomes less readable as the making those formal wedding invitations look like a ransom note.
typeface becomes too condensed or too Unless, of course, that’s how you want them to look!
extended, point size becomes smaller, leading
becomes tighter (that is, when the line spacing Choosing Text Fonts for Body Copy
is reduced), or line length becomes longer. Extended blocks of text, or body copy, are written (presumably)
In general, text becomes less readable as the typeface becomes too condensed or too extended, with the intention of being read. Choosing the wrong font can make
point size becomes smaller, leading becomes tighter (that is, when the line spacing is reduced),
or line length becomes longer. a section of text dramatically harder to read. Generally, serif text
In general, text becomes less readable as the typeface fonts are dramatically easier to read than sans serif text fonts.
becomes too condensed or too extended, point size Studies (see Type and Layout by Colin Wheildon, Strathmoor Press)
becomes smaller, leading becomes tighter (that is, when the
line spacing is reduced), or line length becomes longer. have shown that more than five times as many readers will show
good comprehension of a block of text when a serif text font is used
If you find yourself forced to use -point Helvetica* Compressed instead of a sans serif text font.
Ultra with -point leading, it is time to start editing! Does this mean that all copy must look the same? Not at all.
Within the category of serif text fonts there are many distinct
options. The typeface Times differs dramatically from Kepler,
Adobe Jensen, Ellington,® Chaparral, Bembo,® Utopia, or ITC
Veljovic®—to name just a few!
Blue Island ™
mixed (upper- and lowercase) will have a more dramatic impact
than whether or not your typeface has serifs. Headlines that are set
in capitals are significantly harder to read than those of mixed case. Voluta Script
®
Spring ™
Shuriken Boy ®
Adobe Type Manager® (ATM®) ATM Light is a system software character, character code A single letter, punctuation mark, number,
component for the Windows® and Mac OS platforms that space, or any other object or symbol in a typeface set. In the
automatically generates high-quality bitmapped character shapes context of modern computer operating systems, it is often
on a computer monitor from PostScript® Type or OpenType defined as a code with a meaning attached to it. For example, the
outline font data. ATM Light also allows you to print PostScript decimal character code represents the letter a. Also see
fonts on non-PostScript printers. ATM Deluxe is Adobe’s personal character encoding, keyboard layout, OpenType, Unicode.
font management application. character mapping See character encoding.
baseline The imaginary line on which the majority of the character encoding A table in a font or a computer operating system
characters in a typeface rest. that maps character codes to glyphs in a font. Most operating
body text The paragraphs in a document that make up the bulk systems are moving from a platform-specific single-byte
of its content. Body text should be set in an appropriate and easy encoding system that limited the number of possible glyphs in a
to read face, typically at or point size. font to to a new two-byte international encoding standard
called Unicode. Unicode allows for the inclusion of up to ,
boldface A typeface that has been enhanced by rendering it in
glyphs in a single font. Adobe’s OpenType fonts are based on
darker, thicker strokes so that it will stand out on the page.
Unicode. Also see character, glyph, keyboard layout, Unicode.
Headlines that need emphasis should be boldface. Italics are
preferable for emphasis in body text. Some publishing color See typographic color.
applications allow you to apply a computer-generated, or fake, condensed A narrower version of a font, used to fit a maximum
bold style to a regular weight font. Using this technique is not number of characters into a given space.
recommended.
PFB file The portion of a Windows PostScript Type font that PostScript Type 1 A font format designed to conform to the
contains the font’s outline information. PostScript page description language. On Windows, PostScript
Type fonts consist of a file that contains the font’s outline
PFM file The portion of a Windows PostScript Type font that
information and a file that contains the font’s metrics. On the
contains the font’s metrics information.
Mac OS platform, PostScript fonts are composed of screen fonts
paragraph rules Graphic lines associated with a paragraph that (or bitmapped fonts) and printer fonts (or outline fonts).
separate blocks of text. Rules are commonly used to separate PostScript fonts require a PostScript printer to render accurately
columns and isolate graphics on a page. Some programs allow or they can be printed to a non-PostScript output device using
paragraph styles to be created that include paragraph rules above Adobe Type Manager. Also see PostScript font, Multiple Master.
and/or below the paragraph.
printer font One of the two components of a PostScript font for
pica A unit of measure in typography. A pica is equal to points. the Mac OS. The printer font contains mathematically-defined
The traditional British and American pica is . inches. In outlines for all characters (or glyphs) in that font, and is
PostScript printers, a pica is exactly 1/6 of an inch. downloaded to the printer when that font is used in a document.
picture font A font that displays pictures or symbols instead of Also known as an outline font.
letters or characters. Picture fonts are useful for making logos, proportional figures Numerals that have different widths depending
borders or interesting bullets. Like clip art, they can also be used on their shape. When setting body text, it is preferrable to use
as graphic raw material in some graphics software packages, proportional figures. Also see tabular figures.
such as Adobe Photoshop® or Adobe Illustrator.® Also known as
raised cap A design treatment in which the first capital letter of a
pi fonts, symbol fonts, and dingbats.
paragraph is set in a large point size and aligned with the baseline
point A unit of measure in typography. There are approximately of the first line of text. Also see drop cap.
points to the inch. A pica is points.
reverse The technique of printing or displaying white or light-
point size The most common method of measuring type. The colored text on a black or dark background for emphasis. This
distance from the top of the highest ascender to the bottom technique greatly reduces legibility, especially with small type.
of the lowest descender in points. In Europe, type is sometimes
measured by the cap height in millimeters.
serif A small decorative stroke at the end of a letter’s main strokes. typographic color The apparent blackness of a block of text. Color
Serifs improve readability by leading the eye along the line of is a function of the relative thickness of the strokes that make up
type. the characters in a font, as well as the width, point size, and
leading used for setting the text block.
style One of the variations in appearance, such as italic and bold,
that make up the faces in a type family. Unicode An international double-byte character encoding standard
that encompasses virtually all of the world’s languages.
symbol font A category of type in which the characters are special
Supported by many of the leading hardware and software
symbols rather than alphanumeric characters.
manufacturers, Unicode assigns a unique value to each of the
tabular figures Numerals that all have the same width. This makes it characters (or glyphs) in all of the world’s languages.
easier to set tabular matter. Most fonts have tabular figures. Also
see proportional figures.
Adobe, the Adobe logo, Adobe Caslon, Adobe Garamond, Adobe Jenson, Adobe Type Manager, ATM, Bickham Script,
Blue Island, Calcite, Chaparral, Cronos, Illustrator, InDesign, Jimbo, Kepler, Minion, Myriad, Photoshop, Postino, PostScript,
Shuriken Boy, Utopia, Voluta, and Warnock are either registered trademarks or trademarks of Adobe Systems Incorporated
in the United States and/or other countries. Bembo and Ellington are trademarks of the Monotype Corporation registered
in the U.S. Patent and Trademark Office and may be registered in certain other jurisdictions. Ocean Sans is a trademark
of the Monotype Corporation and may be registered in certain jurisdictions. Caravan Borders, Helvetica, Optima, and Times
are registered trademarks or trademarks of Linotype-Hell AG and/or its subsidiaries. ITC Veljovic and ITC Zapf Dingbats
are registered trademarks of the International Typeface Corporation. Spring is a trademark of LetterPerfect. Celestia is a
trademark of MvB Design. Mac is a trademark of Apple Computer, Inc., registered in the U.S.and other countries. OpenType
and Windows are either registered trademarks or trademarks of Microsoft Corporation in the U.S.and/or other countries.