Type Was Originally Designed to be Read With Ease
The summer of 1998 issue of C:JET featured a series of articles on typography, including a feature by Laura Schaub and instructional materials, including a collection of exercises
BY LAURA SCHAUB
We’ve crunched it, stretched it, smooshed it and whooshed it. We’ve trampled it, filled it, curved it and twisted it. We’ve shattered it, splattered it, squashed it and twirled it.We’ve even been very creative with it, but in doing so, we have sometimes caused it to be totally unreadable. Along the way, we seem to have forgotten that type was designed to be read with ease.
In recent years, with technological advances in desktop publishing, graphic designers have been able to create headline, copy and caption designs in unique ways. Some designs can be read with ease; however, others are totally unreadable. Even spreads or copy areas that are designed professionally may not illustrate sound use of typography.
Two schools of thought exist in typography and design. Some designers believe type is an art form in and of itself. They create typographical designs that are difficult to read so the reader will actually spend time looking at the design and reading through it.
Others lean heavily toward designs which make copy easy to read, allowing the reader to skim through copy, locate information and read without visual interruption.
Both design styles have merit. However, problems arise when designs are developed without reason or purpose causing difficulty for the reader. Therefore, it is essential that the designer understand the rules associated with typography before breaking them.
Most typographic experts sort type into seven groups: oldstyle roman, modern roman, sans serif, square serif, script/cursive, text and novelty.
Oldstyle roman includes fonts which have serifs, small strokes projecting from the tops and bottoms of the letters. The serifs in this group are roughly hewn into each letter. In addition, there is little difference between the thin and thick portions of the letters in this type group. These characteristics help the reader distinguish each letter separately; therefore, this group is the easiest to read. Oldstyle roman can be used for headlines, body copy, captions, logos, and other type-heavy areas. It works well for almost any design. Examples of oldstyle roman type include Palatino, Garamond, Caslon and Times.
Modern roman type faces also feature serifs; however, they are precisely attached to the ascending and descending portions of the letters.
A dramatic difference exists between the thin and thick portions of the letters. Modern roman fonts are an excellent choice for headlines, logos, nameplates, and subheadlines; however, they should not be used for body copy, as the thin lines tend to disappear when the type size is reduced below 14-point. Examples of modern roman type faces include Bodoni, Photina, Caledonia and Americana.
The sans serif type group has no serifs attached. Because of their lack of serifs, they are more difficult to read than oldstyle or modern roman type faces. Sans serif fonts work well for advertisements, headlines, subheadlines, and small copy areas, such as captions or secondary sidebars. This type group includes Helvetica, Arial, Franklin Gothic and Optima.
Square serif, also known as slab serifs or Egyptian fonts, have a heavy appearance. The serifs actually resemble small blocks or rectangles. Square Serif fonts work well for serious logos which reflect an unwavering attitude. Because this type group is are so heavy, it does not work well for secondary headlines, body copy or captions. It should be used to reflect a certain mood or to set a certain tone. Examples of square serif type include Rockwell, Clarendon and Aachen.
Text type, also known as Black Letter, resembles the hand-written copy produced by monks prior to Johannes Gutenburg’s introduction of moveable type to the western world. Ornate in appearance, fonts in this group convey a feeling of tradition and formality. Some newspapers, such as The New York Times and The Dallas Morning News, use text type for their nameplates. Text fonts are often found on wedding invitations and other important documents, such as diplomas and certificates. However, they are rarely used in contemporary publications and should never be set in all caps. They should not be used for body copy or captions. Examples of text type include Linotext, Goudy Text, Wilhelm Klingspor and Old English Text.
Script & cursive
Scripts and cursives are also used to convey a tone or mood. All resemble handwriting. Scripts appear to be connected while cursives do not. Some are ornate in their appearance and reflect sophistication. Others look more like notes scribbled hurriedly to a friend. Because they are difficult to read, they should never be set in all caps. In addition, they should not be used in small copy areas. Examples of scripts include Shelley Allegro, Snell Roundhand, Brush Script and Gando Ronde. Cursives include Mistral, Zapf Chancery and Monotype Corsiva.
Novelty faces reflect a variety of moods in their design. Some of the popular “grunge” faces, such as Harting, Remedy, Paisley, Texas Hero and Chromosome fall into this category. Designers should use these types carefully, always with a specific reason or purpose in mind. Ornate faces and others in this category which are difficult to read in large sizes should never be used for body copy or captions.
When mixing type faces in headline designs, advertisements, logos, and pages, graphic artists should use “family harmony” or “blending harmony.”
Family harmony is achieved by staying within the same type family, such as Berkeley, and using a variety of styles within the design, i.e., Berkeley, Berkeley Medium, and Berkeley Book Italic. Blending harmony features type from three different groups, such as an oldstyle roman, sans serif and script.
Rarely do designers mix types from more than three groups. And almost never do designers mix fonts from the same type group, such as two oldstyle romans or two sans serifs in the same design.
Type consistency within a publication is also a must. For example, in a newspaper or newsletter, primary headlines should be set in one font throughout the publication. Primary sizes should be standard sizes, such as 30, 36, 42, 48, 60 or 72-point. Usually primary headlines are set in bold type with secondary headlines set in a lighter type. Secondary headlines are at least the size of the primary headline. Standard sizes for secondary headlines are 14, 18 and 24-point. Standardizing headline sizes throughout a publication helps maintain consistency.
Other type elements which should be designed and set in a consistent manner throughout a publication include bylines, jumplines, standing headlines, captions, folios and folio tabs. Defining stylesheets Adobe InDesign not only ensures consistency but also makes page design easier and faster.
When using type on a page or spread, designers should try to remember several important points to avoid problems with readability.
- Avoid overprinting or reversing captions or other type on photos. Place captions and type on white areas or on very light screens, if possible. Sometimes it is acceptable to reverse type on a black or solid, dark-colored area; however, if the type is reversed, it should be set a little larger (possibly 12-point) to improve readability. This should only be used on short secondary coverage areas, such as lists, bulleted items, or other types of informational graphics.
- Avoid running type on ghosted photos. It makes the type difficult to read in addition to ruining the photo.
- Avoid printing type on patterned screened areas. This, too, slows readers and causes them to skip the copy.
- Avoid the use of all-caps in headlines and other copy areas. All-caps are much more difficult to read than are caps and lower case or sentence style copy.
- Avoid setting body copy wider than 20 picas or narrower than 10 picas. Copy set too wide causes the reader’s eye to “get lost” in the story. Copy set too narrow, espe cially copy that is justified, causes large “rivers” of white space to form in the copy, thereby distracting the reader. To reduce the “rivers,” the designer could justify narrow copy to the left to improve readability.
- Use larger type (18-point) and extra leading or white space between lines when running copy wider than 20 picas to increase readability.
- Set large areas of body copy in a 10 or 12-point oldstyle roman face. Break up the gray space using subheadlines (12 or 14-point bold), large initial letters (14 or 18-point), icons, or one line of extra white space between large blocks of text. Select a method of breaking up gray space and use it consistently throughout the publication. Avoid starting a second or third column with subheads or initial letters; it confuses the reader who may think this is where to start reading. Avoid bumping subheads and initial letters from column to column. Instead, scatter them through the story so that they don’t “touch” each other.
- For captions, use 8-point type which contrasts in some way with the body copy. In other words, if the body copy is set in 10-point Palatino, the designer may want to set the captions in 8-point Helvetica bold to create contrast for the reader. The designer may also want to use a 12 or 14-point small headline over the captions to “match” the design of the headline. These elements should become a part of the “style rules” of the publication and maintained consistently throughout the publication.
- Type should never be placed vertically or diagonally down the page. Vertical or diagonal placement of type causes extreme difficulty for the reader. Readers are accustomed to reading from left to right rather than from top to bottom.
- When using type as a primary emphasis area, such as for a large headline, try to make a verbal-visual connection between the content of the photo and the kind of type and design style for the headline. For example, if the headline reads, “Fade to Black,” the designer may want to actually “fade” the word, “Fade,” and set the word, “black” in heavy, black type. The photo illustration that might accompany this primary headline should also display the concept and connect to the angle of the story.
But above all, remember: type was designed to be read with ease.
Most rules are just rules of thumb – they can be broken under the right circumstances. Here are 13 good rules to avoid breaking.
BY LAURA SCHAUB
Having taught journalism courses for 28 years, I’ve seen a few scary publications designs. Although some problem designs are due to poor photography or poorly placed elements, often these “graphic nightmares” are created through the misuse and abuse of type. Here are 13 lucky suggestions to improve readability and help you avoid the creation of poorly designed publications:
Use bold face or italic type for emphasis only. In the past, I’ve judged publications that contained lengthy stories set in bold or italic type. When an entire story or publication is set in this manner, the story either “screams” at the reader (in bold face) or has low readability (in italic type). Rather than using bold or italic type for the whole story, use it to help the reader navigate through the story by creating bold or italic subheadlines scattered through the text. Use italic type to distinguish between rows of people in group captions or to introduce special concepts to a reader in the form of a list or other informational graphic. Bold face type also works well for captions in contrast to the use of regular type for body copy.
Avoid the use of long blocks of all capital letters. They have lower readability than sentence style or caps and lower case. Remember that capital letters are wider than lowercase letters; therefore, a headline writer can include more information in a headline set in sentence style or in caps and lower case. In some instances, all-cap headlines are acceptable; however, all-caps should never be used for headlines or copy set in text, script, cursive or novelty type groups as they are virtually impossible to read when set in that manner.
Don’t use fonts in the text type group (such as Old English). Most faces in this group resemble type that was created in Johannes Gutenberg’s day and convey a message of antiquity. Text type works well for nameplates on newspapers which have been in existence for many years. It might look appropriate for use on a primary headline for a story about a Medieval Fair. Because this type is so ornate in its design, it should not be used for body copy or captions.
Stick to traditional serif and sans serif fonts for body copy and headlines. Other ornate types such as scripts and cursives can work well for emphasis words in primary headlines, logos, large initial letters and small headlines over captions; however, they should not be used for body copy or captions because they are not easy to read in small sizes.
Designs with type printed on top of photos often do not work well. In addition to causing problems for the reader, they also destroy the beauty of the photograph. As a reader, I find it disturbing to see type plastered across someone’s face. It is even more disturbing to try to view a photo that has been “ghosted” or printed lighter than 100 percent with copy placed on top of it. Ghosting a photo destroys the content and communication value of the photo.
Lines are barriers
Use lines and boxes as “barriers” when including them in your design. Readers stop when they see a line. Use the rules and boxes to separate sidebar copy areas from the main story but don’t use them to separate the headline from the story it represents. Headlines and accompanying stories should be “packaged” together as one unit.
Avoid placing type on patterned screen areas, textured backgrounds or dark-colored blocks as it can be extremely difficult to read. The more the designer inhibits the readers, the less chance they have to read the story and fully understand it.
Keep the line length reasonable. Most typography experts agree that 10-point type should not be set narrower than eight picas and should not be set wider than 20 picas. One way to figure the maximum line length of a particular size and style of type is to set the letters of the alphabet horizontally one and one-half times. Then, measure it. Another method of figuring the maximum line length is to double the point size and call it “picas.” In other words, 12-point type times two is 24. Therefore, the maximum line length for 12-point type is 24 picas.
Avoid using hand-lettered copy areas. Many of the new type fonts available today resemble handwriting and work well in certain circumstances. Handlettered headlines, copy areas, and captions do not reproduce well and are very difficult to read.
Leading = 120%
Use leading that is approximately 120 percent of the point size of body type in traditional copy areas. In other words, if you are using 10-point type, set the leading at (10 x 120%=) 12 point.
Keep the leading consistent throughout the publication with the exception of special copy areas, such as lists or theme copy in yearbook, for example. Use “extra leading” for special, heavy type areas to help the reader peruse them.
Select type for primary headlines, logos, nameplates, advertisements and other special areas so that it reflects the personality of the publication or story it represents. If it’s a special story geared to a feminine audience, use a type that works well with that concept. If it’s a “heavy” story, use a strong, bold type for the primary headline. In other words, be sure that your font “matches” the mood and tone of the story, and appeals to the target audience.
Content dictates type
The headline design, including the selection of type for the primary headline, should come from the content of the dominant photo. For example, if a designer has a beautiful photo of a ballerina dancing with her partner, the content of that photo dictates the rest of the design. The graphic designer might choose a script type for the primary headline, using words like “Swirling and Twirling.” Then, the designer might add a secondary headline in an oldstyle roman type to further explain the story and to draw the reader into the story. The designer probably would not select a heavy, square serif type for the primary headline, as it would not reflect the mood and tone of the photo or the story. It’s important to remember that the headline, dominant photo and story all work together to make a strong verbal-visual connection for readers and, thus, pull them into the story.
From a type designer’s point of view, fonts are more than just items in a menu. They’re art.
BY BRIAN WILLSON
You can edit a paragraph, diagram a sentence, conjugate a verb. You can fix typos, neatly print the alphabet, hand-stencil a sign. But if you really want to dismantle the written language to its most fundamental elements, to peel each letter down to its tiniest essentials — each bump and serif, each stroke and curve — you’ve got to become a type designer.
A type designer is a person with an artist’s eye, a perfectionist’s obsessions, and the patience of a monk. It also doesn’t hurt to have a cloister, where you’ll end up mumbling to yourself such interesting terms as “kerning” and “ligature”, “ampersand” and “dieresis.” But chiefly, you’ve got to love the teensy subtleties of written language — each bowl and descender, the dots on each j and i. By manipulating these wee bits and pieces, given sufficient effort and time, you can end up with a full complement of characters in several weights and styles, a typeface with a voice as unique and personable as a distant ancestor or the teenage kid next door.
First a disclaimer: I happened onto type design in a roundabout way: communication school, broadcast journalism, the editorial department of a magazine. Along the way, I picked up an interest in graphic design and began noticing fonts’ peculiarities. I have no formal typographic training, and my designs tend to be casual or fanciful, handlettering faces or reminiscences on historic themes. (My personal favorite is Texas Hero, based on the fine, legible penmanship of Thomas J. Rusk in the first half of the nineteenth century.) But I’ve taken pains with a text face or two, have done my share of wee-hours fiddling, have gone bug-eyed over kerning pairs.
Consider Pumpkinseed. Inspired by a certain style of almost architectural handlettering, Pumpkinseed nagged me until I dropped everything and commenced to making its letters. I worked with paper samples at first, digitized with a flatbed scanner. As with most of my work, I ended up hand-tracing each curve and line of every enlarged letterform using a vector drawing program — software that defines shapes mathematically through manipulation of a series of curve and corner points. Like a font, these mathematical definitions will scale to any size.
Working with vector art takes practice, a steady hand, and a technician’s precision. But it’s the artist’s eye, that look askance, that seems to take the most concentration. I spent hundreds of hours on the standard 200-plus characters of Pumpkinseed. (Don’t stop at the upper- and lowercase alphabets — there are punctuation marks, numerals, accents, and plenty of cryptic symbols you’ve never heard of.) I revised several letters three or four times before the head-tilt went away. And then I felt a need to add light and heavy weights to the face, with oblique styles of all three. Most font-making software will automate much of this process — you can fatten up or slim down a series of characters with a mouse click or two — but you’ll end up with an inferior font that has a machinegenerated look. Type designers have spent centuries refining the subtle relationships of ascender to x-height, of em-square to baseline. It pays to follow their lead.
Then there’s kerning. Certain pairs of letters need to be close to each other, like A and V or T and o; other pairs benefit from a little distance, say D and C. Essentially, kerning pairs take into account such relationships whenever they occur in a typeset sequence, ensuring that the copy is pleasing to the reader’s eye. But think for a minute how many letters in an alphabet — or a font. Think of all the combinations. Kerning takes some time.
But ample opportunity arises for design challenges: true italics, with their urgent curl; ligatures and swash characters, for that extra stylishness; picture fonts for entertainment.
Eventually, finally, it’ll be time to generate your working typeface family. It’s anticlimactic: you push a couple dialog-box buttons, and you’ve got your finished fonts, in whatever style, for whatever platform. But it’s rewarding, too, to see your hard work just as you envisioned it on the printed page. Chances are the folks who end up using your typeface will have no idea just how hard you eyeballed every bump and serif, each curve and kerning pair. But that’s O.K. It’s a type designer’s secret, after all.