Guide to Serif Fonts - Typography€¦ · UK, c.1930. Designed by Eric Gill (of Gill Sans fame), Joanna is an elegant slab serif designed as a book type, with a characteristically

Guide to Serif Fonts

fifi fi fi fifi fi

!fi

fi fifi

fifi fifi

fi fifi fifi fi fifi

fi!fi fifififi fi

fi

fifi

Categories

• There are many categories of type.

• These are based on the ways in which the letters are drawn: ways which have changed over time.

• One broad category is serif type, but there are many variations within this.

• Type was originally created with the tools of the goldsmith, and the capital letters were based on chiselled inscriptional capitals.

• The natural finishing strokes made with a chisel or engraving tool are called serifs.

Serifs

Serifs

Terms

• baseline

• x-height

• ascenders

• descenders

• serifs

• stroke width/weight

• stroke variation

• figures

• colour

• spacing (tracking & leading)

• We need to be able to identify types by noting certain characteristics. These include:

baseline

• While we write on lines in exercise books, type generally sits on an invisible line called the baseline.

• Some letters have elements that descend below the invisible line.

• Some curved letters (o, e, t) actually dip slightly below the baseline at their lowest points.

x-height

• While o and e might dip below the baseline, the lower-case x always sits flat on the line.

• We measure the height of the letter x in order to gauge the overall height of the lower-case letters: the x-height

• Greater x-heights make for more legible text at the smaller sizes generally found in newspapers.

x-heightx-height x-height

x-heightx-heightx-height

x-heightAscenders

Descenders

Note that the letter t is almost never as highas an l or an h: the t is only just taller than x and e

Elegance vs. Legibility

• As a general rule, lower x-heights with longer ascenders and descenders make for more elegant-looking text.

• However, when space is at a premium and a smaller type size is necessary, it’s time to go for a larger x-height and greater legibility.

• Both of the above bullets use type at 36 points!

Spacing: Tracking

• The amount of horizontal space taken up by a font depends both on the physical width of the characters and the spacing between them.

• Adjustment of the spaces between letters will allow more words per line – at the cost of legibility.

• Be wary of letterspacing lower case: to some type purists it’s a sin.

• L E T T E R S P A C I N G U P P E R C A S E I S S O M E T I M E S A P P R O P R I A T E .

Spacing: Leading

• Leading is the typographical term for line-spacing.

• This originally referred to the physical lines of lead put into composed type in order to create space between lines.

• The optimum amount of line spacing will depend on x-height, descender & ascender length, and the point size of the type.

• 12 point type with 14 point spacing looks tight. 12 point type with 20 point spacing may be hard to read on longer line lengths.

Leading: examplesThe quick brown fox jumps over the lazy dog. Now is the time for all good men to come to the aid of the party. The quick brown fox jumps over the lazy dog. Now is the time for all good men to come to the aid of the party.

The quick brown fox jumps over the lazy dog. Now is the time for all good men to come to the aid of the party. The quick brown fox jumps over the lazy dog. Now is the time for all good men to come to the aid of the party.

The quick brown fox

jumps over the lazy dog.

Now is the time for all

good men to come to

the aid of the party. The

quick brown fox jumps

over the lazy dog. Now

is the time for all good

men to come to the aid

of the party.

The quick brown fox

jumps over the lazy dog.

Now is the time for all

good men to come to

the aid of the party. The

quick brown fox jumps

over the lazy dog. Now

is the time for all good

men to come to the aid

of the party.

14 on 14 pt 14 on 16 pt

14 on 20 pt14 on 24 pt

Stroke

• Early typecutters were imitating either pen strokes or chiselled inscriptions.

• The first types therefore closely resembled handwriting, with strokes apparently made with the split nib of a quill pen

Variation

• Stroke variation adds light and shade to a printed page, aiding the process of legibility by making individual letters more distinctive.

• Over the centuries, type became less like hand-drawn letters and stroke variation became both more and less extreme, depending on fashion and design aesthetic.

Colour

• When used to refer to printing, the word colour refers to the overall shade of grey created by the chosen type.

• Stroke width and variation, point size, tracking and leading will all have an effect on the colour.

Figures

• The numbers in a font are often very distinctive.

• Ranging figures run across the top of the baseline:

1 2 3 4 5 6 7 8 9 0• Old-style figures (OSF) include some

numbers that dip below the baseline:

1 2 3 4 5 6 7 8 9 0

Old-Style Figures

• Ranging figures are best for columns of numbers

• But old-style figures are more elegant in blocks of continuous prose.

Roman Alphabet

• The roman alphabet is so-called because the earliest Renaissance types (15th C) had capital letters based on the inscriptions on Trajan’s column in Rome (113AD).

• The lower-case letters were based on a form of 9th–12th C handwriting called the Carolingian Minuscule.

Carolingian Minuscule

Trajan’sColumn

Jenson’s roman, c.1470

Venetian Old Style

• The original Roman type was first cast in Venice around 1470.

• The x-height of the letters is quite low, with long ascenders and descenders.

• There is a characteristic upward slope to the bar of the lower-case e

• Also known as Humanist types

Humanist type - 15th Century

• The early Roman types were in some ways crude.

• There was little variation in stroke width, so the “colour” of a page was relatively dark.

• Contemporary examples of this type include Centaur and Jenson

• There were no italics originally paired with these early Romans, but contemporary fonts include them.

Italics• Italics are a third alphabet based on a popular

style of cursive handwriting, used in the Vatican

• They were originally used to save paper and print cheaper books because they were more compact than Roman types

• But there were no Italic capitals, so standard Roman capitals were used!

Centaur

q oNote that the thin stroke in letters like q and o are atan angle to the vertical (in this case approx 280°), imitating letters formed with a split-nib pen.Serifs are quite thickly cut and generally angled. The cross-bar of the e has an upward slope and a short spur.

e

Old Style

• Later Old Style types had a more upright design than Venetian Humanist styles.

• The Old Style design lasted hundreds of years, moving North from Italy, through France and Holland to England.

• Most current re-workings take liberties with the original designs.

Bembo

q oItaly, c.1495. The stroke in the e is now horizontal, though there is still a slight spur. The o is still has a pronounced slant (277°), and the serifs are finer, with a more obvious wedge shape.

e

Garamond

q oFrance, c.1540. There are multiple variations carrying this name, some of them more upright, some with more incised letters (e,g, Adobe Garamond). The spur has been incorporated into the letter e, adding to the thickening effect of the upward curve. The o in this version is at 275°. Now paired with an italic for the first time.

e

Pairings

It took until the 16th Century (in France) before someone used an Italic type alongside a Roman type for contrast and emphasis.

Janson

q oHolland, c.1600. The characters are more upright. The o has almost lost its slope, and the serifs are smoother.The contrast between thick and thin strokes is less pronounced than later fonts of this type, however.

e

Caslon

q oEngland, c.1725. High contrast between thick and thin strokes, and a narrower o, which is almost upright. Many variations available commercially: this is Caslon 540.

e

Transitional & Modern

• Transitionals are so-called because they represent a clear stage in the evolution of type from Old Style to the later Modern types.

• Modern in type design refers not to the age we live in but to a specific style of type, produced in France & Italy in the later 18th Century.

Baskerville

q oEngland, c.1750. The bar in the e is now sharply defined, and the contrast between thick and thin strokes is very pronounced. The o is upright, and the type is now very clearly engraved rather than drawn, with narrower letters allowing for more text per page. Baskerville also introduced the first truly black ink.

e

Didot

qoFrance, c.1800. Didot, like Baskerville is an upright design, but now the contrast between thick and thin strokes is exaggerated, creating a striking and elegant effect. Serifs are now hair lines rather than wedges. These fine hair serifs were very fragile and not up to the rigours of the high-speed rotary press, introduced in the 19th C.

e

Bodoniq oItaly, c.1800. The books printed by Gianbattista Bodoni are considered to be among the most beautiful in history. The upright, narrow letters with hair serifs create a pleasing colour on the page. Like the Didones, Bodoni’s types worked best with letterpress printing, and were unlikely to survive the rotary press. Many variations exist, some with subtle bracketing on the serifs.

e

DisplayThe popularity of the Moderns is unabated in the 21stCentury. They’re particularly used as magazine and display types, often rendered as jaunty “hand-drawn” variations.

HAMBURGEh

RSamburger

Later Developments

• The Moderns of Didot and Bodoni are considered to be the pinnacle of letterpress printing.

• Later versions of serif Roman types needed to take account of the high-speed presses.

• In the digital age, every era of serif type is well served, with recent originals available alongside.

Slab Serifs

• One solution to the fragility of the Modern fonts was to thicken the serifs, making them more slab-like than hair-like.

• 19th Century slab serifs are still quite common.

• Exaggerating the slabs creates distinctive display faces.

Clarendon

qoUK, c.1845, named for the Clarendon Press in Oxford. A heavier slab serif, frequently used for signage, and even WANTED posters in the old west. The e is almost a closed loop.

e

Way Out West

q oUSA, c. 1995. Some slab serif faces exaggerate the slabs, making them thicker than the regular strokes. Way Out West is a recent reworking.

e

Joanna

doUK, c.1930. Designed by Eric Gill (of Gill Sans fame), Joanna is an elegant slab serif designed as a book type, with a characteristically narrow italic. The o has a backward slant, and the lower-case d has Gill’s trademark hump.

e

Scala

q oNetherlands,1990. Scala has a similar feel to Joanna, and also has a companion sans serif. The o is more upright, and the italic is more traditional than that of Joanna.

e

Other Developments

• Now that type is no longer based on hot metal, the whole history of type is available digitally.

• While many current designers currently favour sans serif designs, traditional book types have never gone away.

Legibility• It is often claimed that sans serif fonts are “more

legible” than serif designs.

• In reality, most people prefer what’s familiar.

• Serifs do perform a function in long passages of continuous prose, blending characters together in words – when we read, we read 3–4 words at a time.

• Books printed with sans serif designs often lack colour on the page (or even have too much).

Times

q oEngland, c.1930. Developed to survive the rigours of high-speed printing, Times is a throwback to Old Style type (the o is angled back at around 283°), but having the narrow width of the later Moderns, making it suitable for use in newspapers. Rarely used in newspaper printing now, Times is instead a default font in many word processing programmes.

e

Palatinoq oGermany, 1948. A large x-height and some calligraphic elements make this old-style face distinctive. Designed by Hermann Zapf, it works well with Zapf’s Optima, and is often the prettiest font available on bog-standard PCs. The o is at 283°.

e

Minionq oUSA, c.1990. Minion is one of many Adobe Original types introduced in the DTP age. It has a wider set and a lower x-height than the narrow newspaper types, taking its design cue from earlier classics such as Bembo and Garamond, with low contrast between thick and thin strokes. The o is angled at around 278°, with some letters featuring sharply incised points. Minion gives a pleasing colour to the page, with a classic yet contemporary look.

e

Stone

qoUSA, 1987. One of the earliest Adobe Originals, Stone was designed by Sumner Stone. An old-style face with a large x-height and short ascenders and descenders, it works well at small sizes, and has been designed to harmonise with a sans serif version with the same proportions. There is also an informal version with a single-storey a and more rounded edges.

e

Finally......a word about italics

Italics

• The first italics were based on cursive handwriting, and were created as stand-alone book types.

• In the 16th Century, italics were paired with roman types, becoming more script-like and more related to the roman form.

• The main characteristics of italics are the forward slope, and the single-storey a.

Choosing

• If italics are to be a major feature of the printed work, consider choosing the font based on a preference for the italic.

• Some italics make a special feature of the ampersand (&).

Variations

• Adobe Jenson &

• Bembo &

• Garamond &• Caslon &• Bodoni &

• Joanna &

• Scala &

• Adobe Garamond &

• Minion &

• Palatino &• Stone &