You are on page 1of 25

Introduction

To
TYPOGRAPHY

Ust.Ahmed Magdi
Introduction
Design helps the systems of daily life run smoothly, letting
users and readers ignore how things are put together. Design
should sometimes announce itself in order to shed light on
the system, exposing its construction, identity, personality,
and politics.
– Ellen Lupton (Lupton, 2004, p. 173)
Typography shapes language and makes the written word
‘visible’. As the screen is increasingly becoming the way we
acquire information, the manner in which text is displayed matters.
Our processes of reading and writing are fundamentally reliant
upon our abilities to use and interpret words. Typefaces can link
the writer and the reader in new ways that go beyond the mere
exchange of words on a page. The form and function of type, then
plays a significant role in our ability to make meaning. Moreover
with the proliferation of images in media-rich screen environments
and the unrelenting competition for the user’s attention, words
must also be able to attract, inform and seduce quickly. Helfand
(2001) contends that technological advances pose new creative
challenges for digital typography so it “must be reconsidered as a
new language with its own grammar, its own syntax, and its own
rules” (¶ 1).
To operate in this increasingly image-driven world, type has
evolved as its own visual entity. The distinctiveness of typefaces,
how they function on-screen, how they have evolved for the
computer and how they affect legibility and readability are vital
topics influencing digital type designs today. Finally a move
toward kinetic type also poses considerations for digital
typography practice and digital realms as spaces for reading and
writing.

Introduction to Typography 2
Defining Type

“Typography is what language looks like.”


–Ellen Lupton (Lupton, 2004, inside cover)
Typography is a method of delivering the message to the
viewer. Historically, typography has been defined as the art of
designing letters. However more recently typography has come to
mean the “the visual appearance of any written text, particularly as
to how various visual elements might be arranged to create a
written document and how arrangement might include readers’
perceptions, attitudes and understandings” (Reinking, McKenna,
Labbo and Kieffer, 1998, p. xx). In essence, this definition
basically assumes that all text, regardless of medium, has a
typographic dimension.
Reinking, McKenna, Labbo and Kieffer (1998) believe we are
now heading into a post-typographic world – a world where
printed texts are no longer dominant. They see typographic as
referring to text displayed on a sheet of paper or other static
material surface. Post-typographic texts on the other hand are
displayed in digital form on ‘dynamically alterable surfaces’ such
as a computer screen (Reinking et al., 1998, p. xx-xxi). Our
experiences with print have shaped our expectations for the screen.
For type on screen to look acceptable to our physical requirements
and cultural expectations, type has to transform to the requirements
of the digital space (Spiekerman & Ginger, 2003).

The Character of Type


Typography is letters (and numbers) and why they look the
way they do. Sometimes letters are BIG AND LOUD and
sometimes letters are small and quiet. Typography can make
words look good. It can also make words look bad. But the
way they look—whether they’re pink or purple or big or
small or quiet or noisy or happy or scary or funny or weird,
well, that’s something that comes from typography.
–Jessica Helfand (Helfand, 2001, p.165)
Introduction to Typography 3
Typography brings distinctiveness to our written
communications. Helfand (2001) asserts that “we all ‘sound’ alike”
as everyone writes in system fonts (¶ 14). Thus the materiality of
language is not a neutral vehicle to convey meaning. Visual effects
such as bolding, sizing and typeface choice make writing and
letterforms into visual entities, “adding meanings of the visual
modes to those writing” (Kress, 2003, p. 65).
Typefaces can position the reader in a text and give a certain
kind of status to the information displayed on a screen (Jewitt,
2006). Fonts can be a visual clue into a writer’s intention, signal
the mood or personality of a character, indicate the type of
information – fictional or factual, that the reader has encountered,
or even mimic handwriting. For instance, Courier is a font that is
often used to visualize factual information, while Vivaldi is
commonly used for wedding invitations. Though typefaces can be
an indicator of personality, we are taught to look for the
personality of the author in the choice of words used and not in
their visual appearance (Bolter and Gromala, 2003). In this sense,
readers become more like word processors – trained to ignore the
texture and appearance of texts (Bolter and Gromala, 2003).
Unconsciously we are aware of the emotive qualities of type
though. The physical characteristics of a typeface (e.g. light or
heavy) can contribute to our reading of particular words or
sentences. Furthermore, new readings can be created by changing
letter spacing, kerning, font size and colour.

The Screen

Unlike book typography, the new screen typography dances;


it sings; it shouts; it does somersaults and cartwheels, and
then, when it settles down, just as you think you have got a
hold on it, you mouse over a word and it transforms instantly
into something completely different.
–Jessica Helfand (Helfand, 2001, p. 115)

Introduction to Typography 4
The screen, as a socio-cultural construction, is for watching and
consequently distances us from writing. The screen moves us into
a world of optical illusion, where words become images – a
‘representation’ of printed text. As there are no physical
letterforms but a collection of computer coding consisting of
pluses and minuses; the text is in fact simultaneously visible and
invisible (Purves, 1998). What we see on screen are “little
unconnected dots that trick our eyes into recognizing pleasant
shapes” (Spiekerman & Ginger, 2003, p. 21). Screen colours are
not created from CMYK (Cyan, Magenta, Yellow and black or
‘key’) but broken down in to course lines or dots in RGB (Red,
Green and Blue), where black is not a colour but the absence of
light. In this environment type struggles to be seen. Script or
trendy fonts in particular have no place on-screen as they “hide
more than they reveal” (Spiekerman & Ginger, 2003, p. 73).
Written texts can provide the reader essential visual
information which becomes part of the process of reading. On-
screen, long texts are typically broken up into chunks so they can
be readily accessed by search engines or hypertext links. Designers
use typography to assist readers to navigate through masses of text
by providing visual cues, such as paragraph indents, to indicate a
new idea or highlighted links, to signal a pathway to further
information (Lupton, 2004). Typography has often been touted as
a tool to assist with readability; however, Lupton (2004) argues
that the design of type actually assists readers to ‘avoid reading’ (p.
63).
The screen emphasizes the visual character of writing. Loxley
(2004) speculates that in the future written language might be
replaced by a system of symbols, ideograms such as dingbats. A
single system of symbols could mean a universal language – read
by anyone. The ‘@’ symbol is an example of how the status of a
typographic symbol can become ubiquitous. Dingbats as a
typographic mark, act as signs that express an idea that would
often take up too many words to explain. These kinds of symbols
act as type; understood by a broad cultural audience.
Introduction to Typography 5
Computer Fonts

“People were going to learn more about fonts and typography


using the Macintosh than they had since Gutenberg first got
this hands inky.”
– Steven Levy (Levy, 1994 as cited in Loxley, 2004, p. 228)
Many computer typefaces are adaptations of type made for
print. Loxley (2004) contends that typefaces are most effective
when they have been designed specifically for the medium in
which they are used. Type designer Zuzana Licko of Émigré
Graphics created the first bitmap type designs for the first-
generation of Macintosh computers and in turn put the materiality
of words into question. Words stored as ASCII (American
Standard Code for Information Interchange) text can be indexed
and retrieved by search engines; however, with bitmaps, words
were turned into images that appear invisible to search
mechanisms.
Early computers had low resolution displays which affected
the aesthetic components of type. VanderLans and Licko (1993)
state “it is impossible to transfer typefaces between technologies
without alteration because each medium has its peculiar qualities
and thus requires unique designs” (p. 223). Early digital
letterforms had jagged edges which became the aesthetic identity
of the medium. However with the advent of Adobe PostScript type
became vectors or letter forms described mathematically to the
computer. Fonts could be scaled freely with their edges remaining
smooth in print or on screen (Loxley, 2004).
Cascading Style Sheets (CSS) allow designers to embed fonts
in their designs using ‘@-font-face’ coding (Lupton, n.d.).
However, many font foundries are steering clear of @-font-face
embedding for fear of piracy. Embedded Open Type (.EOT)
supported by Internet Explorer obscures copying; however, .EOT
has not become a standard across the web (Lupton, n.d.). Web
Open Font Format (WOFF) is being taken up by several foundries
now as it attempts to meet the needs of both the users and
Introduction to Typography 6
copyright holders. These changes signal that we are on the verge of
a new typographic diversity which will affect typographers, web
page behaviour and design in general, in the future.
Legibility and Readability
The essence of the New Typography is clarity. This put into
the deliberate opposition to the old typography whose aim
was ‘beauty’ and whose clarity did not attain the high level
we require today.
– Jan Tschichold (Tschichold, 1928 as cited in Barth, 2008,
¶1)
One of the main ongoing debates in text legibility and
readability is font choice. Barth (2008) claims that in a world of
unstructured and structured data, the visual language of typography
is a key component of readability. Today, the ability to turn data
and information into knowledge that supports learning, innovation
and decision-making relies on comprehension. As well, being able
to sort through information and data quickly considers reading
speed – a component of productivity (Barth, 2008).
It is generally believed fonts that use serifs are considered
more legible that those that do not, and that serif fonts accelerate
word recognition. Typefaces such as Caslon, Baskerville and
Garamond are often preferred because the “letters fit together in
such a way that the reader is never conscious of each letter, but
only of word and sentence” (Orton, 1977, p. 30). However on-
screen, serifs tend to disappear due to the bitmapped resolution of
computer monitors. Schaible (2007) observes that many websites
make use of sans serif fonts such as Arial and Helvetica; although
these fonts are not necessarily the most legible online as they were
designed for a different medium.
Type designer Matthew Carter created two typefaces
specifically for online contexts: Verdana, a sans serif typeface
recommended for body text and Georgia, a serif typeface,
recommended for headlines (Schaible, 2007). Verdana works well
online as it is extended; there is extra space between characters so
they don’t touch and it has a large “X” height which makes
Introduction to Typography 7
characters appear larger on screen (Schaible, 2007). In 2006
Microsoft extended its web fonts, with the ClearType Font
Collection, including such typefaces as Cambria and Calibri. Using
fonts designed for the web, instead of using pictures of fonts, like
the early bitmaps, affords quicker reading speed and accessibility
advantages.
As each design situation calls for varying typographic
strategies, a ‘best’ or ‘easiest-to-read’ typeface is impossible to
determine. Thus the results of legibility and readability research
can only provide broad guidelines. In fact in online environments,
designers lack control over the visual representation of the final
product, as web browsers and user preferences can often override
design decisions. Type designer, Eric Gill asserts that ultimately
“legibility, in practice, amounts simply to what one is accustomed
to” (Spencer, 1969, p. 11).

Kinetic Type
Typography can now be endowed with dramatic qualities,
among them, subtext (what is really happening beneath the
surface?) and context (how might the surface be extrapolated
and extended across a situation or story?).
–Jessica Helfand (Helfand, 2001, p.117)
In interactive environments, type is often silent and static and
in constant competition with sound and image. With new
technologies type is no longer confined as it can talk – in any
language, with music and at any volume (Helfand, 2001). With
motion pictures, animation and web spaces, type can move through
space and time. In these environments, letterforms become “agents
in an increasingly complex layering of information” (Miller, 1996,
p. 1). This shift takes the traditional printed page, that relies on
hierarchies of small to large, to represent depth to an environment
of spatial and temporal dynamic – near-to-far (Miller, 1996). The
reader navigates textual displays with a sense of moving deeper
and deeper into a document (Miller, 1996). Type then becomes
dimensional or sculptural.
Introduction to Typography 8
Digital texts are infinitely fluid and malleable. In virtual
spaces, typefaces can rotate, twist, extrude, slide, dance, dissolve,
crumble, explode, etc. In this sense, Bolter and Gromala (2003)
argue that digital writing can empower writing as an art of visual
expression. For example, Excretia is a typeface that Diane
Gromala made and used in her publication with Jay Bolter entitled
Windows and Mirrors: Interaction Design, Digital Art, and the
Myth of Transparency. With Excretia the digital letters change and
morph as the writer engages with the text. The look of the
‘biomorphic type’ is dependent upon the heart rate, respiration and
galvanic skin response of the writer. Using a biofeedback device,
data continuously streams affecting the visual character of the
typeface in real-time; making type not just a productivity tool but a
reflective and interactive experience that bridges text and image
(Bolter and Gromala, 2003).

Conclusion
“To think with type is to be in a partnership with the medium—
with its history, its discourse, its systematic nature as a
common cultural artifact.”
– Ellen Lupton (Hunter, 2006, ¶4)
Type is ubiquitous. With the digital realm extending our
abilities to reach diverse audiences, the way in which we
communicate becomes just as important as what we communicate.
It is much easier for others to understand our message if we put in
the right voice – the voice of type – the visual language that links
writer and reader (Spiekerman & Ginger, 2003). Typefaces can
position the reader in a text and bring emotion and character to
writing, beyond the words and intentions of the author.
The post-typographic world has seen an evolution in typeface
design. With technical advances type now lives and breathes in
digital spaces. As the space of the screen renders fonts different
than that of print, legibility and readability influences type designs.
As we are increasingly bombarded with images, sounds and

Introduction to Typography 9
videos, the visualization of language remains essential to capturing
limited attention spans.

TYPOGRAPHICAL ELEMENTS

• Display type. (Not to be confused with novelty type.) Large


type: headers, titles, etc.

• Body type. Text. Type that makes up content.

• Artwork. Photos, illustrations, graphics, etc.

• Space. White space .... or negative space.

• Typographic color. Refers to the texture of the page, not color


per se. Pages with inordinate amount of type are said to be gray.

There are many strategies that designers use to break up a copy-


heavy page or to explode the grey of the page to make the layout
more interesting, inviting, reader-friendly.

Many of these strategies help “modulate” the page, or create a grid


of sorts (often referred to as Mondrian or modular design), and —
in so doing — ultilize or reinforce various design principles.

USING TYPE CREATIVELY / EFFECTIVELY

Reader-friendly is design smart. Another side of the type equation is


space. Readers are drawn to open, clean pages — pages that use type
and space effectively.

As noted earlier, type is design and designed and can


work as the dominant element on a page; indeed, even replace the art. (As
will be pointed out later, indeed, letterform is often employed by designers
to frame, nest or work as an underpinning of a design.)
Introduction to Typography 10
Margins are central to good presentation and easy and inviting reads.

Typographic strategies help steer visual traffic onto and through your pages.
Typographic strategies include:
• Dropped initial (decorative) initials
• Graphics
• Color
• Bolding and other type weight strategies
• Sidebars
• Pull outs / pull quotes
• Bullets
• Screens and tints
• Reversed type
• Crossing heads
• Variation in point size
• Extra leading
• Subheads, decks, teases
• Exploding the opening paragraph

Mixing typefaces? No surefire tenet, except that less is more. Some faces
are nearly fool proof. Many old-style Romans can be used for just about any
job: Caslon, Garamond, Goudy; as can almost all transitional romans -
Times-Roman, Palatino, Baskerville, New Century Schoolbook. Some
designers vary the weights and widths of the same face to get an array of
affectations without endangering unity. Two or three faces per job are
plenty.

READABILITY and LEGIBILITY The bottom line is that the type


communicate, which normally translates to readability — i.e., the type
provides an efficient and easy read. Legibility refers more to visibility —
or how seeable the type is. Generally speaking, Roman (serif) type tends
to be more readable — sans serif more legible.

Introduction to Typography 11
UC vs. lc We are creatures of habit and used to reading downstyle.
Lowercase structure is more readable because ascenders and descenders
better shape the words we read. UC takes up more room, is more
monolithic, monotonal, difficult to read, but quite suitable as display.

ALIGNMENT refers to line endings. Justified type is more problematic


because it causes more hyphenations, uneven word and letter spacing, and
gapping — but — it is more traditional and a journalistic standard as well
as a typographic nuance we inherited as a type strategy and code from the
scribes. Ragged (right) is less traditional, more informal and produces fewer
hyphenations, a clean design and an easy read.

TYPE SPECIFICATIONS

1. SIZE: First number of spec or write up. 10 / 11. Measure from


highest point (either capline or ascender line to descender
line).Type measured in points. Be specific. Call size with audience
in mind.
Equally important in text type size is x-height of face.

2. LEADING: Term gets its name from hot type technology:


literally the metal (usually) lead strips placed between lines of
type. 2nd number: 10 / 11 in type mark up. Leading that’s too
tight makes reading claustrophobic and difficult. Too much leading
tires the eyes in copy heavy situations. RULE OF THUMB: Add 2
pts to size.

3. LINE LENGTH: Line length measured or designated in picas.


Long and short lines hinder a read. Optimum formula for width:
1.5 X of lowercase
a-to-z measure. E.g., at a given point size, if a -to- z
measures 12 picas, optimum line length would be 18.

4. LINE ARRANGEMENT: Line may be aligned or arranged


several ways:
Introduction to Typography 12
• JUSTIFIED: Except for paragraph line endings or indents,
margins even on both sides. Very traditional, formal, borrowed
directly from scribes. In narrow situations, justified type causes
hyphenations, uneven letter and word spacing, rivers of white and
gapping.

• FLUSH (NEAT) LEFT: Type aligned evenly on left side, except


for paragraph indentations. Also referred to as ragged type, or
ragged right. Fewer hyphenations, more informal, good readability.

• FLUSH (NEAT) RIGHT: Opposite of above.


Type aligned evenly on right side. Also referred to as ragged left.
Much more difficult for us to read.

• CENTERED (NEAT CENTER): Centered type more common in


scant amounts, titles, by-lines, crossing heads, copy in some
advertising. Difficult for us to read in large amounts due to
tracking problems.

CONTOURED: Type is literally groomed or arranged to


follow the line of graphics in a layout. Most common in
advertising, rebus layouts, etc

5. TYPEFACE: Name of type family (and where warranted


number); be specific! E.g., Garamond, Helvetica, Goudy, Times
Roman, etc.

6. WEIGHT: Refers to amount of ink or darkness of a given face.


Minimally, type comes in light, medium (normal or regular), bold.
There are many other weights: med. light, demi-bold, semi-bold,
ultra bold, black etc. Weights commensurate with use or popularity
of type.

7. STYLE: Usually, roman, wide, italic, condensed, expanded etc.


Introduction to Typography 13
8. CAPITALIZATION vs lowercase. All Uc is more difficult to
read, less differentiation between letter configuraton and letter
architecture, so our eyes have to work harder to read. Also, we are
less familiar with this arrangement. Ascenders and descenders
better shape words. All CAPs takes more space up as well...latter
OK in scant amounts, as in headlines, etc. Downstyle — preferred:
only first words in a sentence, proper nouns, acronyms run in
upper case.

9. LETTERSPACING / WORDSPACING. Letter spacing different


from kerning. Kerning used to adjust spaces between specific
letters due to unit problems in type configuration. Spacing (units)
may be fine-tuned to compensate for letterspacing or wordspacing
problems — en masse, or for a given word or a given line in a
publication.

LOGOTYPE: In hot type, two characters cast in a single


piece of type, typically in uppercase / lowercase letter
arrangements, particularly with wide unit uppercase letters (T, V,
W, etc)

LIGATURE: Two or more letters joined by a common


stroke.

10. POSTURE: Refers to type alignment: Roman (or upright) is


by far most common; Oblique (pitched forward slightly);
Backslanted (or Raked).

Introduction to Typography 14
Understanding Typography
What is a typeface—a font?
When you refer to a “font,” it is helpful to understand the meaning
of the term. The terms “typeface” and “font” are often used
interchangeably, but a font is a typeface in a specific size, or, more
accurately, a font consists of three elements: typeface (e.g., Arial,
Times New Roman), weight (e.g., Bold or Italic), and size (e.g., 12
point).
A typeface is a set of characters (letters and numbers) which has
been designed with a certain distinctive shape and is given a name.
The “family” or group name of the typeface is often named after its
designer; or the designer may give it a name that suggests its use,
i.e., Bookman or Century Schoolbook.
Managing fonts was a thorn in the side of graphic designers.
PostScript fonts consisted of a screen font (which kept track of the
font’s spacing characteristics and kerning pairs) and a printer or
outline font (which contained the information about each character
shape).TrueType fonts contained all the information in only one
part. But TrueType fonts often caused problems when printing to a
PostScript imagesetter.
OpenType Typefaces
We now have OpenType fonts, which are based on Unicode (an
international, cross-platform standard that assigns numbers to the
characters in a font). Before Unicode, the recognized standard was
ASCII, which has a character set of 256 characters. But, Macintosh
and Windows use different encoding schemes. Unicode enables a
character set of up to 65,000 (enough characters to include Roman,
Greek, and Cyrillic alphabets, all in the same font). However, all
OpenType fonts do not necessarily have an expanded character set.

Introduction to Typography 15
Special Characters and Glyphs
A glyph is a specific form of a character. For example, in certain
fonts, the capital letter A is available in several forms, such as
swash and small cap. You can use the Glyphs palette to locate any
glyph in a font when using InDesign. OpenType fonts such as
Adobe Caslon Pro provide multiple glyphs for many standard
characters.
OpenType Font Compatibility
OpenType fonts are supported on Mac OS X, Windows 2000 and
Windows XP. With Adobe’s ATM (Adobe Type Manager), you
can use them as far back as Mac OS 8.6 and Windows 98. There
are some older applications that do not recognize PostScript
OpenType fonts. These fonts may not appear in their font menus.
The Adobe applications are: Illustrator 7 and 8, Photoshop 5.0,
Adobe Photo Deluxe Versions 1-3, and Image Ready version 1.
Acrobat version 4.05 and 5 work all right, but text featuring
extended OpenType characters may not copy and paste correctly or
be searchable, depending on how the PDF was generated.
When some documents that are created in some Mac OS
applications are opened in the Windows version of the application,
incorrect fonts are displayed (Even though the same fonts are
installed on Windows). This problem occurs in common Windows
applications such as Microsoft Word, Adobe PageMaker and
QuarkXPress.
Getting well-set type
Good typography is spacing, the way letters and words fit together.
Good spacing is something you achieve by paying attention to how
the printed page looks. Carefully spaced type has an even texture
without black spots from colliding characters or rivers of white
from ill-fitting words. Composition is still not fully automated in
any desktop application. Achieving good spacing involves turning
on kern pairs, using the “Spacing attributes” and “Hyphenation”

Introduction to Typography 16
features, tracking, kerning, and kern pairs. Some programs provide
you with these features and some only partially.
In the days of metal type, spacing was loose by today’s standards,
because it had to be. When photocomposition came in at the end of
the 1930s, tight spacing became fashionable. Now, tight letter
fitting is not as acceptable. Tight spacing requires more
adjustment. If you bring letters close together, other letters—
spaced normally by older standards—look loose. You adjust them,
and still others seem out of balance. Even worse, tightly spaced
type is likely to be hard to read (letters run together), it has poor
color (little optical blobs form when characters get close to each
other), and the characters may appear deformed because of the lack
of balanced space between them.
Well-set type aims at balance and transparency. Letters and other
characters are surrounded by spaces that appear to be equal. Since
every character has a unique shape, the spaces between the
characters will vary, and ideally you want them to look equal.
Ligatures
Ligatures are two or more characters fused into a single character.
One example is the ampersand, which is a stylized abbreviation of
et, the Latin word for “and.” InDesign allows you to substitute
standard ligatures for the lowercase fi and fl combinations.
Whether or not you use ligatures depends on the font you are
using.
Letter spacing
Letter spacing is the distance between letters and includes any
kerning or tracking values you may have applied. A character’s
width is determined not just by the character itself, but also by the
space that the font designer adds around the character
(sidebearing). If you are very particular about how your printed
page looks, then InDesign has more controls than word processing
programs. InDesign ships with the “Desired” letter spacing set to 0

Introduction to Typography 17
percent, which means it leaves the font’s spacing alone when it is
not justifying text. But for justification, you may want to set the
letter spacing to a minimum of -2% to a maximum of 2% in which
most of the word spacing values are used for justification. These
adjustments are expressed as percentages of the spaceband’s width,
which varies from font to font. And, you can change these
percentages to suit your needs.
Other Spacing Problems
Runs of straight-sided letters must be spaced carefully, particularly
when set in sans serif type, to avoid a hard-to-read, picket-fence
effect. To get around this, avoid leaving spaces that are either the
same width as the stems of the characters or as the width of any
opening inside letters like u and m. But do not use the spacing of
straight-sided letters as a model for other pairs. If double o’s are
too close together, for example, the eye will see a blob between
them; such letters should be spaced a bit further apart to avoid this.
Some letters have a tendency to merge visually, forming a different
letter. The rn combination is especially likely to do that, and must
be spaced apart in many typefaces.
Kerning
If letters and other type characters were rectangular, we wouldn’t
need to kern them—the spacing on either side of each letter would
combine to yield evenly spaced type. But the irregularities that
make each character distinctive and legible also make them fit
awkwardly with some other characters. So there is a need for kern
pairs.
InDesign has two kinds of automatic kerning methods: Metrics and
Optical. Either method is adequate for small type sizes. If anything
is noticeable, then you can always resort to manual kerning.
Character pairs to be kerned, and kerning amounts have already
been specified by the font manufacturer, who specifies an
adjustment of the spacing between certain letters, such as A and V,
to make them more aesthetically pleasing. Automatic kerning can
Introduction to Typography 18
be applied locally by selecting a range of text, then choosing
Metrics or Optical from the Control palette (or the Character
palette).
Metrics Kerning
Metrics kerning uses the kern pairs that are built into the font, or
most fonts. The more expensive typefaces tend to have between
500 and 1000 kerning pairs. The cheap font you may have
downloaded from the Web may not have any.
Optical Kerning
This method adjusts the spacing between adjacent characters based
on their shapes and not on kerning pairs. If your font includes few
built-in kerning pairs, you are better off using Optical Kerning.
Decorative and novelty fonts are more likely to have few kerning
pairs.
Tracking
Tracking refers to tightening or loosening all space to the same
degree, without regard for variations in letter shape. If type is
evenly spaced before tracking, it remains that way. If it’s
irregularly spaced to begin with, tracking is likely to exacerbate the
irregularity. Tracking also allows you to compensate for the fact
that, when type is made larger or smaller, the spaces between the
letters may not look right if they are enlarged or made smaller
proportionally.
If you use a typeface that was designed for text setting, tracking
tightens large type, loosens tiny type, and leaves the text sizes
alone. If you are using a display face (one designed to be used at
14 point or above) the track should make no changes in that range
but tighten it at larger sizes and loosen it at smaller size.
Ideally, do not try to set text with display types. You can usually
get away with using text type at large sizes, thanks to tracking, but
it’s always preferable to use a titling or display cut of the same
typeface if it is available for headlines.
Introduction to Typography 19
Word spacing
Word spaces should be approximately equal. In justified text, in
which the extra space is distributed between words, spaces must
appear equal. In today’s technology, our digital fonts include
word-space characters, sometimes called spacebands (the character
that is “printed” when you press the spacebar). Spacebands and
word spaces (among other things) are usually measured in ems.
Although you may hear various definitions of the em, the most
definitive, and the one InDesign uses, is a square that’s the width
and height of the point size being used: for example, in 12-point
type, the em is a square 12 points by 12 points.
Word spaces in many typefaces should be small, around a quarter
of an em, which is the width of the space character in many text
fonts. Spaces should be proportional to the typeface design; for
example, narrow faces need narrow word spaces. They should also
reflect the letter spacing—tighter letters call for smaller word
spaces. Use the same word spaces between sentences as between
words (type the Spacebar once, not twice, at the end of sentences);
the punctuation adds emphasis and a bit more air.
As with all typographic settings, word spacing must be evaluated
from a printed proof for each typeface. Some fonts have much
wider or narrower spacebands, but even if that were not so, the
spaces need to meet your visual test.
Hyphenation
In theory, if the line is long enough and the type size small enough,
you should be able to justify text without breaking words.
However, a long line and small type is probably difficult to read.
InDesign automatically hyphenates words when you justify text. In
InDesign you can set the number of consecutive hyphens and the
hyphenation zone. Even though hyphens are not always desirable,
a few hyphens are preferable to poor spacing, often the only
alternative.

Introduction to Typography 20
Alignment of text
Text alignment plays a part in the readability of a document. Text
aligned on the left is the most readable. It can use the optimum
word spacing and letter spacing that the designer built into the font.
With the alignment on the left, as you read your eye can easily find
the beginning of the next line. When you align text left, make an
effort to keep the right “ragged” side as smooth as possible. Left
alignment is certainly preferable for columns.
When you justify text, the computer forces the lines to extend to a
certain length by adding or deleting space between the words, and
sometimes between the letters. The greatest problem with justified
text is the uneven word spacing. This irregularity is visually
disturbing and interrupts reading. When the text line is longer
(across a page) and the font is not large, there is less chance of
uneven spaces between words.
Text aligned on the right creates a definite look and can be used for
certain effect. There is a drop in readability because your eye must
find the next line to read, and it is not consistent. Robin Williams
suggests that when you use a right alignment for the look it creates,
emphasize the look. Instead of keeping the ragged edge as smooth
as possible, exaggerate it.
For a special effect, use the “Force justify” alignment option to
stretch a single line of text—a headline, for instance—to fill a page
or column width. If you want the spacing to be more evenly
distributed, create non-breaking spaces so that the line of text
would be treated as one long word. In Word, you use the
justification setting and end the line using the Shift+Enter key
combination.
Spacing between lines
The vertical space between the lines of text usually is tied in
automatically to the font size. However, both Word and
WordPerfect allow you to set a precise line height. You may want

Introduction to Typography 21
to have more space between your lines, or you may want to mix
some font sizes within lines of text, which would cause uneven
spaces between the lines of the paragraph unless you specified a
precise line height or leading. A typesetting program such as
InDesign has what it calls “leading” settings. The default is “auto.”
It adds approximately 120 percent of the point size of the font as
the leading setting. You may wish to set your own leading setting
for more control.
Spacing Between Paragraphs
Pressing the Return or Enter key twice between paragraphs (or
after headlines) separates the text with big, awkward gaps. It also
makes it possible to end up with a blank line at the top of a
column. Learn to use styles, and specify in the style the space
before and/or after paragraphs. You can determine exactly the
amount of space you want after headlines and before and after
subheads. A larger space before a subhead and a smaller space
following it tells the reader a new subject is being introduced, and
that it is separated from the preceding material and refers to the
following material.
Underline
Avoid using the underline feature. Underlining was used with
typewriters because typewriters couldn’t set italics. Italicize titles
of books. If you underline italicized type, you are being redundant.
In addition, underlined text usually means that clicking on that text
will take you to another place, as it often indicates a hyperlink.
You may sometimes be tempted to underline to emphasize a
headline or a word, but it is better to use bolding or, for a headline,
a different typeface. Drawing a rule (a line) under text is very
different from underlining. When you draw a rule you have control
over how thick it is, how long it is, and how far below the type it
sits. When you tell your computer to underline, the line bumps into
the letters and obscures the descenders.

Introduction to Typography 22
Using All Caps
Use all capital letters sparingly. They work sometimes when you
consciously choose to accept their lower readability because you
want the look of all caps. We read words by their letters and also
by the shapes of the words. Characters in words set in all caps have
the same shape, so you have to read these words letter by letter.
You can often find an alternate solution to using all caps, such as
bold lowercase, a different typeface, more space surrounding the
text, or a rule beneath or above the text.
Typesetters Quotes
The more advanced word processing programs and page makeup
programs type real quotes (curly quotes). In every program that
does, take advantage of the feature that types them for you
automatically. But do not type curly quotes when you need inch
and foot marks, and don’t type an opening quote at the beginning
of a word that really needs an apostrophe.
Indents
A standard typographic indent is one em space. In 10-point type,
an em space is 10 points wide; in 36-point type, an em space is 36
points wide. When your type is in columns, a half-inch indent is
way out of proportion. You can make first line indents a part of
your styles.

Introduction to Typography 23
Arial Rounded MT Bold, Regular
Baskerville Old Face, Regular
Bauhaus 93, Regular
Bell MT, Regular, Italic, Bold
Bernard MT Condensed, Regular
Bernhard Modern Std, Roman, Italic, Bold, Bold Italix

Britannic Bold, Regular

Catfish Script Pro, Regular


Calisto, Regular, Italic, Bold, Bold Italic

Century, Regular
Century Old Style Std, Regular, Italic, Bold
Century Schoolbook, Regular, Italic, Bold, Bold Italic
Chaparral Pro, Light, Semibold, Semibold Italic,

Carlemagne Std, Regular,


Colonna MT, Regular
Introduction to Typography 24
Copperplate Gothic Bold, Regular
copperplate Gothis Light, Regular
Courier Std, Medium, Medium Oblique, Bold, Bold Oblique
Edwardian Script ITC, Regular
Engravers, Regular
FooFtlight MT Light, Regular
Semibold, Semibold Italic,

Gill Sans Ultra Bold, Regular


Gloucaster MT Extra Condensed, Regular
Goudy Old Style, Regular, Italic, Bold
Harrington, Regular
Imprint MT Shadow, Regular
Adobe Jensen Pro, Light, Light Italic, Regular, Italic, Semibold,
Semibold Italic, Bold, Bold Italic

Lithos Pro, Extra Light, Light, Bold,

Introduction to Typography 25

You might also like