THE SCIENCE OF TYPOGRAPHY
i) classification
iii) legibility
ii) anatomy
iv) alignment
classification OLD Sabon
old style typefaces emulate classic calligraphy
characteristically has thin, straight serifs and sharp contrast between thick and thin strokes
MODERN Bodoni
Jan Tschichold,1966
T
G
Giambattista Bodoni, 1910
A basic system for classifying typefaces was devised in the nineteenth century, when printers sought to identify a heritage for their own craft analogous to that of art history.
iv) grids & margins
v) implementation
Robert Besley, 1845
A C Max Miedinger, 1957
vi) hierarchy
SLAB SERIF Clarendon
bold and decorative with thick, slab-like, serifs
uniform, upright, and without serifs
SANS SERIF Helvetica
Designers in the twentieth and twenty-first centuries have continued to create new typefaces based on historic characteristics; there are many different varieties of typeface, each suited to different jobs.
i) classification
ii) anatomy
anatomy
iii) legibility
iv) alignment
g ascender height
cap height x-height
baseline
descender line
1 2 3 4 5 6 7 8
— — — — — — — —
serif bowl finial shoulder counter stem loop tail
p l gy h
r
er
a t o
iv) grids & margins
v) implementation
vi) hierarchy
o
i) classification
ii) anatomy
iii) legibility
iv) alignment
legibility & readability Certain factors are important in optimising text for legibility, namely spacing and composition.
kerning differs from kerning only in so much as it is a uniform adjustment of character spacing, rather than an adjustment of individual characters.
a header or the first line of a paragraph that appears as the last line on a page; also to be avoided for visual consistency.
leading
the splitting of a word across lines, as an aid to uniform line breaking, not to be used unless necessary.
orpha n
iv) grids & margins
v) implementation
vi) hierarchy
w idow the last line of a paragraph occurring at the top of a page; to be avoided for visual consistency.
tracking the amount of space added between lines of text to make the document legible.
the adjustment of the space between individual characters; whether the spacing is very tight, very wide or somewhere in the middle, making sure they are visually balanced is key.
hyphen-ation
i) classification
ii) anatomy
alignment
h s fluight r
iii) legibility
iv) alignment
h s flueft l
The way in which type is positioned on a page is equally as important as the typefaces selected and the spacing implemented; text can be flush left, flush right, justified, or centered.
iv) grids & margins
v) implementation
vi) hierarchy
i) classification
ii) anatomy
iii) legibility
grids & margins
Layouts are achieved by use of a grid; variations on pages must match divisions in the grid. In addition to page grids there are baseline grids, which act as imaginary page lines, to which all body text must align. To achieve the perfect harmony between text and white space, page margins must be considered into design choices. These are the blank spaces to the left, right, above, and below the content on a page. They allow for consistent pagination, and when used correctly create a very pleasing visual aesthetic.
iv) alignment
iv) grids & margins
v) implementation
vi) hierarchy
i) classification
ii) anatomy
implementation
sans serif
iii) legibility
iv) alignment
s
iv) grids & margins
serif
v) implementation
vi) hierarchy
display Conventional wisdom holds that most projects require only three typefaces, or, more precisely, three type families. All situations may be handled quite thoroughly with good compatible choices of the following: - a sans serif - a good legible serif - a display typeface The available variations in weight, slope, and width should be more than adequate to handle the needs of the content. The primary benefit in this approach is the likelihood that, by limiting the typefaces, compatibility and harmony will be maximised.
i) classification
ii) anatomy
iii) legibility
iv) alignment
hierarchy POSITION Typically, letters in ‘primary’ locations recieve visual priority; upper areas are most prominent— the higher the better.
SIZE Is bigger better? Size can be used to place emphasis on text; a major shift in size can trump position if the point size is big enough.
iv) grids & margins
v) implementation
vi) hierarchy
To create an interesting and dynamic visual hierarchy various elements must be considered.
COLOUR An effective use of colour draws the eye straight to specific text elements; use to either complement or contrast other visual elements.
WEIGHT Varying the weights of typefaces used is also a contrbuting factor; for example Helvetica Bold would stand out more next to Helvetica Regular.
Casey-Drew MMXIV