What’s the right typeface for text? - synergy · 1. Pick a typeface with similar character widths...
Transcript of What’s the right typeface for text? - synergy · 1. Pick a typeface with similar character widths...
Before&After ®
Selecting text type 0269Continued
XiBAmagazine.com U
text?
What’s the right
typeface for How to
choose a typeface for clear, easy reading over long distances. Continued iStockphoto.com
2 of 8
Before&After ® XiBAmagazine.com U
Selecting text type 0269
TText type is more common than any other. Text makes up the acres of gray in books, magazines, reports, and hundreds of other documents. When reading is the primary goal, it’s the designer’s job to ensure that the text is smooth, flowing and pleasant to read. The hallmarks of good text type are legibility and readability. Legibility refers to clarity; it’s how readily one letter can be distinguished from all others. Readability refers to how well letters interact to compose words, sentences and paragraphs. When evaluating the choices, the operative word is medium.
What’s the right typeface for text?For text that’s smooth, clear and readable, the operative word is medium
An example of medium is Utopia.
TextMedium x-height
Medium height-to-width ratio
Medium counters
Medium stroke width variation
Before&After ® Selecting text type 3 of 8 XiBAmagazine.com U
3 of 8 Selecting text type 0269
1. Pick a typeface with similar character widths For the smoothest appearance, an alphabet’s charac-ters should have similar widths. Reading has a nat-ural rhythm; an alphabet such as Futura (below, top) with widely varying character widths disrupts it.
aefjsrmWidely varying widths Futura Light
aef jsrmSimilar widths Times New Roman
2. Medium height-to-width ratio We identify letters by their physical characteristics—stems, bars, loops, curves and so on; the clearer they are the more legible the letter. As letters are compressed (or expanded), these features get dis-torted—diagonal strokes, for example, become quite vertical—and so are harder to identify.
Medium height- to-width ratio ITC Stone Serif
Compressed height-to-width ratio Racer
5
3 1
S S
Before&After ® Selecting text type 4 of 8 XiBAmagazine.com U
4 of 8 Selecting text type 0269
nnn nVectora Utopia Adobe
CaslonCG Bernhard Fashion
Be Be
4. Look for small variations in stroke weight The best text faces have stroke weights that vary somewhat, which make converging lines that help the eye flow smoothly. But avoid extremes. Modern styles (below, left) vary too much; at high resolu-tion their beautiful, superthin strokes disappear in a dazzle. Sleek geometric styles (below, right) vary little or not at all, so are too uniform.
Medium difference Times New Roman
No difference Futura Medium
Bauer Bodoni | Texture and flasp net exating end mist of it snooling. Spaff forl isn’t cub-ular but quastic, leam restart that can’t prast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. I have lot to say.Why? Elesara
Futura Medium | Texture the net exating end mist of it snool-ing. Spaff forl isn’t cubular but quastic, leam restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. I have lot to say. Why? Elesara and order
3. Medium x-height The x-height of a typestyle is the height of its lowercase characters. The larger the x-height, the denser the type will appear. You want medium; unusually tall or short x-heights are better suited for specialty projects.
x-height
Cochin Times New Roman
x-height variations Incredibly, all four typefaces below are the same size: 112 points. For text, avoid the extreme on each end.
PPPMedium x-heights
Too different Bauer Bodoni
Before&After ® Selecting text type 5 of 8 XiBAmagazine.com U
5 of 8 Selecting text type 0269
abg
5. Watch out for mirrors Geometric typestyles are so uniform that their letters are often mirror images. For text, this is not ideal—the more distinct each letter is, the more legible whole words will be. Look for typestyles that don’t mirror.
bbbb
6. Avoid overlarge counters Counters are the enclosed spaces inside letters. Avoid typestyles whose counters are very large in relation to the stroke weight. In the case of Avant Garde (below), note how much greater the space inside the letters is than the space outside! This will slow the reader; set in text (bottom), Avant Garde looks like Swiss cheese!
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t cubular but quastic, leam restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. It has larch to say fan. Why? Elesara and order is fay of alm. A card whint not oogum or bont. Pretty simple, glead and tarm. Texture and flasp net exating end mist of it. Forl isn’t cubular but quastic, leam restart that can’t prebast. Whint not oogum or bont! Pretty simple, glead and tarm. Texture flasp. Silk, shast, lape and behast the thin chack. “It has larch
qbMirrored Helvetica Neue Roman
Not mirrored Gill Sans
Overlarge counters ITC Avant Garde Gothic
Before&After ® Selecting text type 6 of 8 XiBAmagazine.com U
6 of 8 Selecting text type 0269
7. Avoid quirkiness Typographic sprites are fun to look at and great for heads, but in text they wear out their welcome fast. Why? The extra swashiness gives the eye too much to follow and is very tiring.
Favorite text faces While many typefaces meet the requirements of legibility, readability and beauty, the following four are the ones we turn to most often:
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t cubular but quastic; leam restart that can’t preast. It’s tope, this fluant chasible. Silk, chast, lape and behast the thin chack. It has larch to say fan. Why? Elesara and order is fay of alm. A card whint not ooum or bont. Pretty simple, glead and tarm. Texture and flasp end mist of it sno-oling. Silk, shast, lape and behast the thin chack. “It has larch to say fan.” Why? Elesara
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t cubular but quastic, leam restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. It has larch to say fan. Why? Elesara and order is fay of alm. A card whint not oogum or
Texture and flasp net ating end mist of it snooling. Spaff forl
Adobe Caslon (11/12.75 pt) First choice for books, Caslon may be the Roman alphabet’s most readable typeface. Its letters aren’t beautiful, but strung into sentences and paragraphs they have fit, texture, bite, and can be read comfortably for hours. Caslon will withstand even the tightest leading.
gkrvFun, but too quirky for text Belwe
Before&After ® Selecting text type 7 of 8 XiBAmagazine.com U
7 of 8 Selecting text type 0269
Favorite text faces
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t cubular but quastic, leam restart that can’t prebast. It’s tope, this fluantible. Silk, shast, lape and behast the thin chack. It has larch to say fan. Whara and order is fay of alm. A card whit not oogum or bont. Pretty simple
Texture and flasp net ating end mist of it snooling. Spaff forl isn’t
Adobe Garamond (11.5/12.75 pt) If we could have only one typeface, this would be it; Garamond is easy to read and elegant, too. A little on the dressy side, Garamond is a fine display face—rare in this class—and as a result can carry a doc-ument all by itself. Garamond sets small; set text in ten-point minimum with about ten percent extra leading.
ITC Stone Serif (9.5/12.75 pt) Stone is boring to look at but buttery to read. Characterized by its stubby, lower-case r that tucks snugly to its neighbors, Stone is designed for outstanding fit. It sets large; nine-point is as big as you should go. Use at least thirty-five percent extra leading.
Janson Text 55 Roman (10.5/12.75 pt) Janson holds the middle ground between the earthy, workmanlike nature of Caslon and the high classiness of Garamond. Rounder and denser, it has a chiseled, resolute appearance. Janson sets about average size; give it about twenty percent extra leading.
Texture and flasp net exating end mist of it snooling. Spaff forl isn’t cubular but quastic, leam restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. It has larch to say fan. Why? Elesara and order is fay of alm. A card whint not oogum or bont. Pretty sim-
Texture and flasp net ating end mist of it snooling. Spaff forl isn’t cubular Texture and flasp net exating end
mist of it snooling. Spaff forl isn’t cubular but quastic, leam restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. It has larch to say fan. Why? Elesara and order is fay of alm. A card whint not oogum or
Texture and flasp net ating end mist of it snooling. Spaff forl isn’t cubu-
Before&After ® XiBAmagazine.com U
Selecting text type 0269
Subscribe to Before & After
Learn more!
$36 | 24 PDF articles in individual downloads
Before & After is issued one article at a time in a beautifully designed. A subscription is 24 articles. We e-mail you a notice each time we publish a new article, which you then download. You can read the article online in your browser or onscreen in Adobe Acrobat or Reader. We encourage you to print and save your articles in a binder for fingertip reference. We will e-mail you a notice (or two) when it’s time to renew your subscription.
$48 | Available in print, too! Every eight articles, we’ll mail you a beautiful, commercially printed issue in high resolution on glossy paper, bound and three-hole punched. Identical to the PDF subscription and includes the PDF version free. 3 printed issues, 24 total articles.
8 of 8 | Printing formats
Before&After ® XiBAmagazine.com U
Selecting text type 0269
Selecting text type 8 of 8
Before & After magazine Before & After has been sharing its practical approach to graphic design since 1990. Because our modern world has made designers of us all (ready or not), Before & After is dedicated to making graphic design understand-able, useful and even fun for everyone.
John McWade Publisher and creative directorGaye McWade Associate publisherDexter Mark Abellera Staff designer Before & After magazine323 Lincoln Street, Roseville, CA 95678 Telephone 916-784-3880 Fax 916-784-3995E-mail [email protected] www http://www.bamagazine.com
Copyright ©2009 Before & After magazine ISSN 1049-0035. All rights reserved
You may pass along a free copy of this article to others by clicking here. You may not alter this article, and you may not charge for it. You may quote brief sections for review; please credit Before & After magazine, and let us know. To link Before & After magazine to your Web site, use this URL: http://www.bamagazine.com. For all other permissions, please contact us.
Subscribe to Before & After
Subscribe to Before & After, and become a
more capable, confident designer for pennies
per article. To learn more, go to
http://www.bamagazine.com/Subscribe
E-mail this article
To pass along a free copy of this article to
others, click here.
Join our e-list
To be notified by e-mail of new articles as
they become available, go to
http://www.bamagazine.com/email
Before&After ®
Back | Paper-saver format
XiBAmagazine.com U
For paper-saver format Print: (Specify pages 11–14)
For presentation format Print: (Specify pages 1–8)
Before & After is made to fit your binder
Before & After articles are intended for permanent reference. All are titled and numbered.
For the current table of contents, click here. To save time and paper, a paper-saver format of this article,
suitable for one- or two-sided printing, is provided on the following pages.
Print Format: Landscape
Page Size: Fit to Page
SavePresentation format or
Paper-saver format
Be
fore
&A
fter | w
ww
.bamagazine.com
1 of 4
Se
lectin
g te
xt typ
e 0269
0269 S
ele
cting
tex
t type
TText typ
e is mo
re com
mo
n th
an an
y o
ther. Text m
akes up
the acres o
f gray in
bo
oks, m
agazines, rep
orts, an
d
hu
nd
reds o
f oth
er do
cum
ents. W
hen
read
ing is th
e prim
ary goal, it’s th
e d
esigner’s jo
b to
ensu
re that th
e text is sm
oo
th, fl
owin
g and
pleasan
t to
read. T
he h
allmarks o
f goo
d text typ
e are legibility an
d read
ability. Legibility
refers to clarity; it’s h
ow read
ily on
e letter can
be d
istingu
ished
from
all o
thers. R
eadab
ility refers to h
ow w
ell letters in
teract to co
mp
ose w
ord
s, sen
tences an
d p
aragraph
s. Wh
en
evaluatin
g the ch
oices, th
e op
erative w
ord
is med
ium
.
An
ex
am
ple
of m
ed
ium
is Uto
pia
.
TextM
edium x-height
Medium
height-to-width ratio M
edium countersM
edium stroke
width variation
text?
What’s the right
typeface for H
ow to
ch
oose a typeface for
clear, easy readin
g over lon
g distan
ces.iStockphoto.com
Be
fore
&A
fter | w
ww
.bamagazine.com
2 of 4
Se
lectin
g te
xt typ
e 0269
0269 S
ele
cting
tex
t type
Bauer B
odoni | Texture and flasp net exating end m
ist of it snooling. Spaff forl isn’t cub-ular but quastic, leam
restart that can’t prast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. I have lot to say.W
hy? Elesara
nn
nn
VectoraUtopia
Adobe
Caslon
CG
Bernhard
Fashion
Be B
e
4. Loo
k fo
r small variatio
ns in
strok
e w
eig
ht
Th
e best text faces h
ave stroke w
eights th
at vary so
mew
hat, w
hich
make co
nvergin
g lines th
at help
th
e eye flow
smo
oth
ly. Bu
t avoid
extremes. M
od
ern
styles (below
, left) vary too
mu
ch; at h
igh reso
lu-
tion
their b
eautifu
l, sup
erthin
strokes d
isapp
ear in
a dazzle. Sleek geo
metric styles (b
elow, righ
t) vary little o
r no
t at all, so are to
o u
nifo
rm.
Me
diu
m d
iffere
nce
Tim
es New
Rom
anN
o d
iffere
nce
Futura M
edium
Futura Medium
| Texture the net exating end m
ist of it snool-ing. Spaff forl isn’t cubular but quastic, leam
restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. I have lot to say. W
hy? Elesara and order
3. Me
diu
m x
-he
igh
t T
he x-h
eight o
f a typestyle is th
e heigh
t of its
lowercase ch
aracters. Th
e larger the x-h
eight, th
e d
enser th
e type w
ill app
ear. You
wan
t med
ium
; u
nu
sually tall o
r sho
rt x-heigh
ts are better su
ited
for sp
ecialty pro
jects.
x-height
Cochin
Times N
ew R
oman
x-h
eig
ht va
riatio
ns Incredibly, all four typefaces below
are the sam
e size: 112 points. For text, avoid the extreme on each end.
PP
PM
ed
ium
x-h
eig
hts
Too
diffe
ren
t B
auer Bodoni
1. Pick
a type
face w
ith sim
ilar characte
r wid
ths
For th
e smo
oth
est app
earance, an
alph
abet’s ch
arac-ters sh
ou
ld h
ave similar w
idth
s. Read
ing h
as a nat-
ural rh
ythm
; an alp
hab
et such
as Futu
ra (below
, top
) w
ith w
idely varyin
g character w
idth
s disru
pts it.
aefjsrmW
ide
ly varyin
g w
idth
s Futura Light
aefjsrm
Sim
ilar w
idth
s Times N
ew R
oman
2. Me
diu
m h
eig
ht-to
-wid
th ratio
We id
entify letters b
y their p
hysical ch
aracteristics—stem
s, bars, lo
op
s, curves an
d so
on
; the clearer
they are th
e mo
re legible th
e letter. As letters are
com
pressed
(or exp
and
ed), th
ese features get d
is-to
rted—
diago
nal stro
kes, for exam
ple, b
ecom
e qu
ite vertical—
and
so are h
arder to
iden
tify.
Me
diu
m h
eig
ht-
to-w
idth
ratio
ITC
Stone Serif
Co
mp
resse
d
he
igh
t-to-w
idth
ra
tio Racer
5
31
SS
Be
fore
&A
fter | w
ww
.bamagazine.com
3 of 4
Se
lectin
g te
xt typ
e 0269
0269 S
ele
cting
tex
t type
7. Avo
id q
uirk
ine
ss Typ
ograp
hic sp
rites are fun
to lo
ok at an
d great
for h
eads, b
ut in
text they w
ear ou
t their w
elcom
e fast. W
hy? T
he extra sw
ashin
ess gives the eye to
o
mu
ch to
follow
and
is very tiring.
Favorite
tex
t faces
Wh
ile man
y typefaces m
eet the req
uirem
ents
of legib
ility, readab
ility and
beau
ty, the fo
llowin
g fo
ur are th
e on
es we tu
rn to
mo
st often
:
Texture an
d flasp net exatin
g end m
ist of it
sno
olin
g. Spaff forl isn
’t cubu
lar but qu
astic; leam
restart that can’t preast. It’s to
pe, this flu
ant chasible. Silk, chast, lape an
d behast the thin
chack. It has larch to say fan
. Why?
Elesara an
d order is fay o
f alm. A
card whin
t n
ot o
ou
m o
r bon
t. Pretty sim
ple, glead and
tarm. Textu
re and flasp en
d mist o
f it sno
-o
ling. Silk, shast, lape an
d behast the thin
chack. “It has larch to say fan
.” Why? E
lesara
Texture and flasp net exating end
mist of it snooling. Spaff forl isn’t
cubular but quastic, leam restart that
can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. It has larch to say fan. W
hy? Elesara and order is fay
of alm. A
card whint not oogum
or
Texture and flasp net ating end m
ist of it snooling. Spaff forl
Ad
ob
e C
aslo
n (11/12.75 pt)
First choice for books, Caslon m
ay be the R
oman alphabet’s m
ost readable typeface. Its letters aren’t beautiful, but strung into sentences and paragraphs they have fit, texture, bite, and can be read com
fortably for hours. C
aslon will w
ithstand even the tightest leading.
gkrvF
un
, bu
t too
qu
irky fo
r tex
t Belw
e
ab
g
5. Watch
ou
t for m
irrors
Geo
metric typ
estyles are so u
nifo
rm th
at their
letters are often
mirro
r images. Fo
r text, this is n
ot
ideal—
the m
ore d
istinct each
letter is, the m
ore
legible w
ho
le wo
rds w
ill be. L
oo
k for typ
estyles th
at do
n’t mirro
r.
bb
bb
6. Avo
id o
verlarg
e co
un
ters
Co
un
ters are the en
closed
spaces in
side letters.
Avo
id typ
estyles wh
ose co
un
ters are very large in
relation
to th
e stroke w
eight. In
the case o
f Avan
t G
arde (b
elow), n
ote h
ow m
uch
greater the sp
ace in
side th
e letters is than
the sp
ace ou
tside! T
his w
ill slow
the read
er; set in text (b
otto
m), A
vant G
arde
loo
ks like Swiss ch
eese!
Textu
re a
nd
flasp
ne
t exa
ting
en
d m
ist of it sn
oo
ling
. Sp
aff fo
rl isn’t c
ub
ula
r bu
t qu
astic
, lea
m re
start th
at c
an
’t p
reb
ast. It’s to
pe
, this flu
an
t ch
asib
le. Silk, sh
ast, la
pe
a
nd
be
ha
st the
thin
ch
ac
k. It ha
s larc
h to
say fa
n. W
hy?
Elesa
ra a
nd
ord
er is fa
y of a
lm. A
ca
rd w
hin
t no
t oo
gu
m
or b
on
t. Pretty sim
ple
, gle
ad
an
d ta
rm. Te
xture
an
d fla
sp
ne
t exa
ting
en
d m
ist of it. Fo
rl isn’t c
ub
ula
r bu
t qu
astic
, le
am
r esta
rt tha
t ca
n’t p
reb
ast. W
hin
t no
t oo
gu
m o
r b
on
t! Pretty sim
ple
, gle
ad
an
d ta
rm. Te
xture
flasp
. Silk, sh
ast, la
pe
an
d b
eh
ast th
e th
in c
ha
ck. “It h
as la
rch
qb
Mirro
red
Helvetica N
eue Rom
an
No
t mirro
red
Gill Sans
Ove
rlarg
e co
un
ters
ITC A
vant Garde G
othic
Be
fore
&A
fter | w
ww
.bamagazine.com
4 of 4
Se
lectin
g te
xt typ
e 0269
0269 S
ele
cting
tex
t type
Favorite
tex
t faces
Texture and flasp net exating end m
ist of it snooling. Spaff forl isn’t cubular but quastic, leam
restart that can’t prebast. It’s tope, this fluantible. Silk, shast, lape and behast the thin chack. It has larch to say fan. W
hara and order is fay of alm
. A card w
hit not oogum
or bont. Pretty simple
Texture and flasp net ating end m
ist of it snooling. Spaff forl isn’t
Ad
ob
e G
ara
mo
nd
(11.5/12.75 pt) If w
e could have only one typeface, this w
ould be it; Gar am
ond is easy to read and elegant, too. A
little on the dressy side, G
aramond is a fine display face—
rare in this class—
and as a result can carry a docum
ent all by itself. Gara m
ond sets small;
set text in tenpoint m
inimum
with about
ten percent extra leading.
ITC S
ton
e S
erif (9.5/12.75 pt)
Stone is boring to look at but buttery to read. C
haracterized by its stubby, lower
case r that tucks snugly to its neighbors, Stone is designed for outstanding fit. It sets large; ninepoint is as big as you should go. U
se at least thirtyfive percent extra leading.
Jan
son
Tex
t 55 Ro
ma
n (10.5/12.75 pt)
Janson holds the middle ground betw
een the earthy, w
ork manlike nature of C
aslon and the high class iness of G
aramond.
Rounder and denser, it has a chiseled,
resolute appearance. Janson sets about average size; give it about tw
enty percent extra leading.
Texture an
d fl
asp n
et exating en
d m
ist of it sn
ooling. Sp
aff forl isn’t cu
bular
but q
uastic, leam
restart that can
’t p
rebast. It’s tope, th
is flu
ant ch
asible. Silk, sh
ast, lape an
d beh
ast the th
in
chack. It h
as larch to say fan
. Wh
y? Elesara an
d ord
er is fay of alm. A
card
wh
int n
ot oogum
or bont. Pretty sim
-
Texture an
d flasp
net atin
g end m
ist of it sn
ooling. Sp
aff forl isn’t cu
bular
Texture and flasp net exating end m
ist of it snooling. Spaff forl isn’t cubular but quastic, leam
restart that can’t prebast. It’s tope, this fluant chasible. Silk, shast, lape and behast the thin chack. It has larch to say fan. W
hy? Elesara and order is fay
of alm. A
card whint not oogum
or
Texture and flasp net ating end mist
of it snooling. Spaff forl isn’t cubu-
Be
fore
& A
fter m
ag
azin
e
Befo
re & A
fter has b
een sh
aring its p
ractical app
roach
to grap
hic d
esign sin
ce 1990. Becau
se ou
r mo
dern
wo
rld h
as mad
e design
ers of u
s all (ready o
r no
t), Befo
re &
After is d
edicated
to m
aking grap
hic d
esign u
nd
erstand
ab
le, usefu
l and
even fu
n fo
r everyon
e.
Joh
n M
cWa
de
Pu
blish
er and
creative directo
rG
ay
e M
cWa
de
Asso
ciate pu
blish
erD
ex
ter M
ark
Ab
elle
ra Staff d
esigner
Be
fore
& A
fter m
ag
azin
e323 Lin
coln
Street, Ro
seville, CA
95678 Te
lep
ho
ne
9167843880 Fax 9167843995E
-mail m
ailbo
x@b
amagazin
e.com
w
ww
http
://ww
w.b
amagazin
e.com
Co
py
righ
t ©2009 B
efo
re &
Afte
r ma
ga
zine
IS
SN
1049-0035. All rig
hts re
serv
ed
You
may p
ass alon
g a free cop
y of th
is article to o
thers
by clickin
g here. Yo
u m
ay no
t alter this article, an
d yo
u m
ay no
t charge fo
r it. You
may q
uo
te brief sectio
ns
for review
; please cred
it Befo
re & A
fter magazin
e, and
let us kn
ow
. To lin
k Befo
re & A
fter magazin
e to yo
ur
Web
site, use th
is UR
L: http
://ww
w.b
amagazin
e.com
. Fo
r all oth
er perm
ission
s, please co
ntact u
s.
Su
bscrib
e to
Be
fore
& A
fter
Sub
scribe to
Befo
re & A
fter, and
beco
me a
mo
re capab
le, con
fid
ent d
esigner fo
r pen
nies
per article. To
learn m
ore, go
to
http
://ww
w.b
amagazin
e.com
/Sub
scribe
E-m
ail this article
To p
ass alon
g a free cop
y of th
is article to
oth
ers, click here.
Join
ou
r e-list
To b
e no
tified
by e-m
ail of n
ew articles as
they b
ecom
e available, go
to
http
://ww
w.b
amagazin
e.com