Archive for the ‘Fonts’ Category
by Dmitry Kirsanov
Source: Design Lab
The history of type design that we’ve just skimmed through is probably the only useful guide (besides your own experience and preferences, of course) in choosing fonts for “plain text,” one-face projects. In such cases your single concern should be about a good match between the style, semantics, and intended impact of your text and corresponding properties of the typeface it uses. You can’t set Shakespeare plays in a sans serif font (even of the “humanist” variety), and fragile Modern serifs are not appropriate for a pushy advertisement message.
However, the majority of design projects pose much more difficult problems: Most often, you have to find two or more different typefaces, each matching not only its corresponding text but also all other fonts in the composition. As I’ve once noted, creating solid contrast links between different fonts is a real challenge. Each font being nearly as complex as a human being, it is next to impossible to find two fonts whose features, so to say, point in opposite directions but along the same line—which is a necessary prerequisite for any contrast link.
Therefore, the safest option in any project is using the same font, or its different variants (e.g. bold or italic), for all of your needs. This “monofont” solution may not be perfect, but in many cases it may be better to ensure one more aspect of consistency instead of taking risky aesthetic decisions. Using one font is by far preferable in small compositions such as logos, where two or (God forbid) more fonts would have too little room to show their true nature, and any difference between them would therefore become an annoyance rather than a meaningful opposition.
But, let’s say you really need two fonts for your work (for example, one for headings and the other for body text), and you’re not satisfied by using variations of the same font. Which pair to choose? The basic answer is well known: serif fonts work fine with sans serifs, and vice versa. These two types of fonts are different enough for their contrast to be immediately obvious, resulting in a strong and stable connection.
Here again, the font history may give you valuable hints on which sans serif and serif faces work best together. As these two font types were not developed in parallel, we cannot base our decisions on historical synchronism; most, if not all, today’s serif faces are rooted in past ages, while the majority of sans serifs were created in the current century. More useful is matching the level of “humanization,” liberty and even looseness vs. that of rigidness and artificiality. Remembering what I’ve said about the general trends of dehumanization of serifs and humanization of sans serifs, we may conclude that early serif faces should be a good match for late sans serifs, and vice versa.
In fact, I’m not sure if it is possible to successfully combine late Modern serifs with early geometric sans serifs—both these designs are dehumanized to the point of being dry and even awkward, but their underlying ideologies are too different and even disparate. However, for higher levels of humanization this recipe works perfectly; just consider that the basic pair of typefaces for all operating systems are Times and Helvetica, which are a good match because they’re both transitional—that is, not too “zealous” but not too liberal either.
For another example, look at the logo of a Russian magazine called Internet. [Link no longer in service. -Ed] Although, as I said, different fonts should be avoided in logos, here the two humanist faces, Garamond and Frutiger, work perfectly together because there’s no visual in the composition and the fonts are left to interact only with each other, and because the contrast between them is so deep and multiaspect (in font, face, color, and slant). Moreover, the same two fonts are extensively used throughout the magazine itself (more consistently in the print version than on the site, due to the obvious HTML restrictions).
The AlphaWorks site offers a similar yet contradicting example. As most other IBM sites, this one was developed by Studio Archetype; however, the decision to make a logo from the humanist Meta sans serif font (particularly favored by this studio’s designers) and an old-fashioned Modern serif font (which is traditional for IBM’s corporate style) resulted in a composition of questionable merits—exactly because of the clashing levels of humanization in these two fonts. It is difficult to suppress the feeling that the contrast in this logo is either insufficient or irrelevant.
As you may conclude from these examples, it is usually a good idea to accompany the contrast of fonts by the contrast of other typesetting aspects, particularly font variations (bold, italic, etc.). These variations are possible along the axes of weight, slant, and width—but you should understand that these axes are not equally applicable to different font types.
You may have noticed that many sans serif fonts do not have italics in the proper sense, but only slanted (sometimes called oblique) variations. This is not by accident; the very nature of sans serif design doesn’t allow for an easy transformation into an italic face (or at least, into what we’re accustomed to regard as such). Contrary to that, most serif fonts have really dinky italics that, despite having very different lettershapes, are well dovetailed with the roman variety.
On the other hand, demibold and especially bold variations do not work particularly well with many serif faces—their serifs seem to obstruct the change in weight, and the relative difference in strokes’ thickness (i.e. the level of contrast) is difficult to preserve in different weights. (Interestingly, a high level of contrast is less of an obstacle for changing weight—hence the extra-bold Fat Face and its likes, built upon Modern serif fonts with their increased contrast.) Sans serifs, on the contrary, are very easygoing when it comes to changing weight—many of them have a wide range of weight variations, from extra light to extra bold. This means that each font has its own most natural variations, and you must take these into account when working with fonts; for example, in a professional work you’re much more likely to see a combination of a bold sans serif font and an italic serif font than vice versa.
What are other ways to increase contrast in a multi-font composition? Sure, a serif/sans serif pair is not the most conflicting of all possible font combinations. You could take, for example, an enticing decorative font, such as a stylized blackletter or script face, and put it alongside a plain sans serif font. Unfortunately, such extreme combinations are rarely satisfying. When fonts are too different, they can’t live happily together; as we’ve already found out, contrast is the strongest between two objects when their opposite features are many, but some common traits are still there.
You certainly cannot use a peculiar decorative font for all text on the page, if only because such fonts are often barely legible. If you’ve used a fancy font for a heading or logo, try to be as discreet as possible in your other font choices. As I’ve said, stylistically sans serif is not the best match for decorative faces; however, it is often better to environ a complex-shaped fancy heading with a plain, graphically poor sans serif text blocks than with a serif font which usually has a much stronger personality. It is also advisable to use quite different sizes and colors for the two fonts, in order to move their contrast from the dimension of lettershapes to the more flexible opposition of sizes, colors, and visibility.
It is worth noting that professional designers rarely use something besides the simple, traditional typefaces. I intentionally restricted my historical sketch to the mainstream type design, because I believe that for a beginner designer it’s much more important to carefully study a small set of classical typefaces than to indulge in “cool” designs, often of questionable quality. The well-known fonts are almost “transparent” for perception not because they’re primitive, but on the contrary, because their complexity is well balanced, because they’re carefully polished by their creators and by the centuries of use. It is this transparency that allows the immaterial qualities of your text and design show through the material envelope of the font.
by Dmitry Kirsanov
Source: Design Lab
The first half of 20th century is the end of the Modern era, the moment when revived typefaces were flooding the typography mainstream. But it was also the time when a completely different font design was booming, called sans serif (which is French for “without serifs”). It wasn’t an absolutely new idea at that time, since first sans serif faces had appeared in the beginning of 19th century; but never before this seemingly peripheral and exotic trend claimed so much importance as in 1920s and 30s.
Actually, it is amazing that the simple idea of dropping serifs at the ends of strokes didn’t occur to the great many typographers who experimented with their shapes and sizes so much. In part, it is due to the inertia of scribes’ tradition who, with their quills, simply could not produce a reasonably clean cut of a stroke. Undoubtedly, old typographers also knew the fact that was later confirmed by experiments: Serifs help the eye to stick to the line and thus facilitate reading.
But the biggest part of the serif persistence was, of course, due to plain habit. When the first examples of sans serif fonts finally appeared, they seemed so controversial that the first name given to them was “grotesque,” and they were very rarely used except in advertising. And so it remained until the newest trends in art and industrial design, most notably the German Bauhaus movement of 1920s (influenced by earlier Russian constructivism), required adequate means of typographic expression. These movements stressed utilitarian aspects in design, claiming that a thing becomes beautiful only when—and because—it serves a practical purpose, denying any attempts to artificially “adorn” it.
The most influential type design of that epoch, the Futura font created in Germany in 1928, displayed the core of the Bauhaus ideology: strictly geometric outline, lacking any embellishments and just barely conforming to the historical shapes of letters. The resulting blend of geometric consistency and aesthetic awkwardness may be disputable, but it was at least something quite new, and therefore impressive, at that time. Now we’re much more accustomed to the look of Futura (and its many derivatives), but the inborn radicalism of the font still shows through.
Futura In The Past, or A Triumph of Geometry:
developed by Paul Renner in 1928, this font may be called
the starting point of sans serif history in our century
As any other radical movement, the “new sans serif” typography of the 1920s couldn’t do without auguring an imminent death of all serif fonts whatsoever. This didn’t happen, of course. Moreover, Futura itself didn’t manage to become so neutral and familiar in the mass perception as to become a standard sans serif font for all occasions. (Instead, this position was taken by Helvetica, a typical “no-nonsense,” “no-big-deal” font that became ubiquitous almost to the point of being misused and nauseating.) However, it cannot be denied that Futura played an important role in sans serif becoming a mainstream type style, an accepted contrasting pair for the time-proven serif fonts.
Of course, sans serif proliferation was also due to the higher demand for display typefaces in all media, the demand which is much more severe than at any time in the past. The most natural use of a sans serif font is still for display purposes (ads, titles, logos, labels of all sorts), although it can be successfully used for body text as well.
It is interesting to note that the development of sans serif typefaces in this century went in a direction opposite to that of the serif type development of previous centuries. Indeed, we’ve seen how serif faces have gone from arty and liberal Old Style, through neutral Transitional design, to the rigid, mannered Modern typefaces. Conversely, sans serif fonts started from Futura with its artificial look, then were for a long time dominated by neutral “transitional” Helvetica, and recently a number of distinctively liberal (and, in some classifications, even termed “humanist”) sans serif faces became popular. Thus, the 20th century process of sans serif humanization is a negation, a mirror image, a contrasting parallel for the earlier process of serif dehumanization in 15th-19th centuries—just as sans serif itself is a contrasting match for serif.
So what are the features of humanist sans serif faces? One of the first such designs was Frutiger (a.k.a. Freeset, developed in 1976); at first sight similar to Helvetica, this font reveals to a careful investigation some “anti-geometric” features, such as uneven width of strokes (especially in bold variants), non-perpendicular cuts, and slightly bent off tips of strokes (e.g. the bottom of the vertical stroke in “d”). All these subtleties were intended to smooth out the too harsh edges of the generic sans serif design and improve legibility of characters, and their net result is a relatively warm and friendly-looking typeface—especially if we compare it to the apathetic Helvetica or phrenetic Futura.
The trends that were hinted at in Frutiger were later fully developed in a family of fonts now extremely popular both on the Web and in print design. The original typeface of this family, called Meta, was developed in 1984 by German designer Erik Spiekermann. In Meta and its offsprings, strokes have slightly varying width (the creator’s goal was that in small sizes, thinner strokes should not “drop out” but, on the contrary, become undistinguishable from the thicker ones) and, in compensation for the missing serifs, vigorously bent-off tips of vertical strokes in letters like “d” or “n.” Both uppercase and lowercase characters are narrower than in most other sans serif fonts (i.e. letters are inscribed into rectangles, not squares). Perhaps here we have an example showing how far can we go in “humanizing” sans serifs and borrowing serif-specific features, while remaining within the sans serif paradigm.
Officina Sans is another Meta-like font designed by Spiekermann
Interestingly, the problems that the designer tried to resolve with the new typeface were purely practical—Spiekermann’s goal was to create an economic font readable in a wide variety of sizes and conditions. Here’s what the designer himself writes in his article: Meta has been hailed as “the typeface for the nineties”; young designers seem to appreciate its rugged charm, which owes a lot to the detailed requirements of small type on bad paper. It was never designed to be a trendy typeface, rather it was designed to solve specific problems. Maybe it is that honest, unpretentious background which appeals to graphic designers and typographers around the world.
Here’s a truly enlightening comparison: Note how the two approaches to a “purely utilitarian” font design, differing only by the fact that one was rather theoretic and the other driven by practical needs, resulted in two fonts as different as Futura and Meta.
by Dmitry Kirsanov
Source: Design Lab
The new type design, belonging to the 18th century, is now called Transitional because of its intermediate position between the Old Style and Modern styles (more on the latter below). Here belong such faces as the ubiquitous Times Roman and Baskerville; their features include higher level of contrast (vertical strokes are noticeably thicker than the horizontal ones), mostly vertical stress (the “O” is symmetric, although lowercase letters, such as “e” in Times, may still have diagonal stress), and a more linear, austere design. Serifs in these fonts are not too long, sometimes pointed, and connected to main strokes through outspoken coves (so the serifs seem to have a triangular shape).
The appearance of these fonts for modern perception is almost ideally neutral. The shapes and proportions of letters, the relative prominence of strokes and serifs, the contrast level—all these features are nearly transparent for the eye, adding minimum, if any, distinctive or “personal” features to a font. In short, transitional design could be a good candidate for a “generic serif font.”
Times New Roman is the most widely used of all Transitional fonts
–and probably even of all existing fonts
It is difficult to name just one reason for this phenomenon. Was it that Times was chosen as the basic computer typeface because of its neutral character, or we perceive it as neutral because we got used to seeing it everywhere? I think that indeed it was the transitional period when the best possible balance was achieved between the freedom and even looseness of Old Style and the mannered rigidity of the new type of 19th century.
That new, sometimes even called “revolutionary,” font design created at the very end of 18th century and dominating throughout the 19th century was, quite naturally, called Modern or New Antiqua. (There are other examples when some intermediate stage in the history of art becomes forever termed “the newest”; for another instance, “art nouveau,” which means “new art,” was current in late 19th century and then obsoleted by other movements—but kept its name.) This style has further developed some of the transitional trends, but decidedly abandoned some others.
Use Modern typefaces to create an old-fashioned look
In particular, Modern fonts have drastically increased contrast, leading this parameter almost to the edge of legibility and technical feasibility (in fact, one of the inventors of the new style, Giambattista Bodoni, had to improve the printing machinery he had available in order to reproduce the new fonts). The long, hairline serifs and horizontal strokes are the first thing we notice about this font style, although it has some peculiarities in the shapes of letters as well.
Due to the high contrast and the lack of almost any coves and rounded corners, the feeling conveyed by Modern fonts is very dry, rigid, elaborate, even unnatural. Although Modern has an easily recognizable style of its own, my opinion is that this font design is a dead end in the history of type, because, in at least one aspect, it has achieved a limit that cannot be pushed any more without losing some essential characteristics of letters.
It is truly ironic that the fonts that were once hailed as a revolutionary improvement and called “modern,” now are perceived so distinctively obsolete and out-of-fashion. Perhaps that’s because the Modern font design was the last to lose dominance. Its displacement took place within our recollection, so we therefore tend to associate it with our direct predecessors, the “parents generation”—which is always divided by a wider generation gap from our own than those who happened to live centuries ago. But maybe the reason is simpler, and the spiral of history has brought us to a point where we’re much closer to the harmony and open spirit of Renaissance than to the self-assuredness and mannerism of the 19th century.
Despite what I said about the “dead end,” Modern has in fact served as a base for several design variations created throughout the 19th century. The most notable Modern offsprings are slab serif fonts where serifs were as wide as main strokes or even wider. Later, Clarendon fonts re-introduced cove serifs and lowered contrast while preserving the overall style of Modern letterforms (New Century Schoolbook is the most widely used Clarendon font). Both classic Modern faces and their derivatives have pretty much dominated the typography scene in the 19th—and well into the 20th—centuries.
However, it didn’t take some new and fashionable design style to replace Modern faces in mass book production. Instead, the century now drawing to a close was marked by an unprecedented wave of revivals—fonts created from ancient prototypes of the Old Style, Transitional, and early Modern ages. It wasn’t long ago that the now ubiquitous Times, Baskerville, Garamond, Bodoni were recreated, using a varying degree of generalization and modernization, by our century’s font artists from old printouts and printing matrices. Now the spectrum of digitized serif typefaces is wider than ever; dominated by revivals, it also contains a plethora of original faces, for both body text and display setting, combining modern trends with the best features of all previous ages of typography.
by Dmitry Kirsanov
Source: Design Lab
Some treatises on the history of type start from ancient Egyptians and their hieroglyphs, but I’d rather restrict my article to those types of fonts that you’re likely to encounter in your everyday work. If we do not take into account some really exotic faces, the modern history of type begins in the 15th century, when the first examples of the fonts now called Old Style appeared (I use initial capitals to differentiate Old Style as a classification term from other uses of the words).
During centuries prior to that time, the prevalent style of letterforms was the one now called blackletter, or “Old English”. Complex, whimsical blackletter shapes were difficult to write and read; what’s worse, they were absolutely clashing with the ideology of then-burgeoning Renaissance movement and its admiration of classic Roman and Greek art. New, humanist writings required creating a new type of fonts—more secular, more legible, and more elegant.
Blackletter
Thus came the first “revival wave,” the first time when font artisans looked into the past in order to create better typefaces for the present. The problem at that time was, however, that ancient Romans didn’t have but uppercase, capital letters. While adopting their designs for capitals, Renaissance typographers had to spend more time working on lowercase lettershapes. As a basis, they took carolingian scripts that were common in early Middle age (before the blackletter had become dominant style across the Western Europe), but changed them significantly to match the Roman uppercase letters and to better adopt to Gutenberg’s printing technology (that had just appeared).
Due to its origin, this new font type was then named Antiqua, i.e. “Ancient.” (Later, the term Antiqua was used for all typefaces that appeared after the blackletter era, and the original Antiqua fonts came to be named “Old Style” or “Humanist Antiqua.”) Ironically, it is these first Antiqua exemplars (more precisely, their 20th century replicas) that have probably the most up-to-date and fashionable look for modern eye. Enough to name such fonts as Garamond, Minion, Jenson; their light, spruce, stylish outline conveys the unfalsifiably humanist spirit, and these fonts are now very popular for all sorts of design jobs.
Formally, the Old Style typefaces are characterized by fairly constant width of all strokes and serifs (typographers say that they have low contrast), complex non-linear shapes of strokes, and so-called “cove” serifs that form curves where they join the main strokes (the ends of serifs are also sometimes rounded). The thick parts of strokes do not necessarily go vertically; look at the “O” or “e” in Village (Fig. 1, bottom), where the thickest parts of the outline are at bottom left and top right. This feature, called diagonal stress, is an attempt to imitate handwriting of the scribes, who held their pens at some less-than-90 angle to the direction of the line.
Old Style
Italic varieties are especially interesting in Old Style fonts. In those times, italic faces had just appeared and were thought of as independent fonts and not as companions to roman faces. Therefore, authors of modern Old Style revivals had to artificially match independent designs, often created by different typographers and in different centuries, to compose a complete font family with roman and italic faces.
Examples of early (top) and late (bottom) Old Style italic faces
Early italic faces had a more handwritten look and a small slant, while later, 16th century italics feature more outspoken slant (sometimes capitals are less oblique than lowercase letters) and peculiarly narrowed letterforms. In roman faces, the late Old Style design (of well-known fonts, Garamond belongs to this period) loses its diagonal stress, the contrast of strokes is increased, and strokes become more linear. Overall, all the most peculiar (or at least, peculiar to a modern look) Antiqua features were ironed out with time—by the end of 17th century, a new type of font design was emerging.
by Dmitry Kirsanov
Source: Design Lab
No other design discipline requires so much learning and training as fontography, and by no other aspect can amateurs be so easily distinguished from professionals. To be font literate, a designer has to study the history and the principles of font design.
So far, fonts as a design topic have received only occasional mentions in the Design Lab pages. This is not because I was unaware of their importance; on the contrary, I just didn’t feel comfortable with such a huge and complicated topic. Finally, I’ve pulled together enough material to write a coherent font design introduction, a set of basics which (in my opinion) one should master to be able to use fonts the right way. I hope this article will become a valuable addition to the design course that this column has become.
The article is not, of course, nearly as comprehensive as a good textbook on the subject. There are lots of books about the design and use of fonts, probably not much less than about design proper; the field is, so to say, very densely populated because of its practical importance and rich historic traditions. So I feel justified in dropping many of the finer points that you can relatively easily find in other sources.
Instead, as it was with color, my goal now is to show you the anatomy of font perception, to help you feel the soul of a font. I’m discouraged by the great many designers writing on the subject only to come up with some very partial, and very peremptory, rules-of-thumb instead of just sharing their feelings about fonts—which could really be much more instructive.
In my opinion, one thing absolutely necessary for working with fonts is knowing their history—what came after what and, more importantly, why. Actually, you may be surprised to learn which of the typefaces installed on your computer are old and which are relatively new. The helix of font history has already made more than one full convolution, and many fonts that seemed almost forgotten were then successfully revived.
Thus, the first sections of the article outline the history of serif and sans serif faces and disclose some general trends in font development. The last section deals with the most important practical problem of choosing and matching fonts in a design composition.