The typographic magazine for forward thinkers.
Back to Basics: Type Casting Stopping Sloppy Typography John D. Berry
Steven Brower
Danny Davis
First Issue December 2014
0 0 0 , 10 Q-Tips
& New Pivot Typeface
Clarity
e
Insid
Grooming the Font Robert Bringhurst
Table of Contents Forward Thinkers Pages listed as followed.
3
V. I
Issued: Dec. 2014
Type Casting
Steven Brower
10
Top 10 Fonts
11
Must See Posters
13
Clarity
Danny Davis Photo: by Myself
1
Baseline
Creating New Document in inDesign
Grooming the Font
18
19
Rober Bringhurst
Three Levels Of Typographic Hierarchy Working With Type in InDesign
Back to the Basics:
29 31
33
Stopping Sloppy Typography
enilesaB
2
Type Casting Article written by designer Steven Brower. Steven was a former art director at the New York Times and is now currently for The Nation. An award-winning Creative Director for PRINT, Brower has much experience in the design and typographic world.
M
y first job in book design was at New American Library, A publisher of mass- market books. I was thrilled to be hired. It was exactly where I wanted to be. I love the written word, and viewed this as my entrance into a world I wanted to participate in. Little did I 3
Shown above are some of Browers book designs
suspect at the time that mass- market books, also known as “pocket” books (they measured approximately 4”x 7” , although I have yet to wear a pocket they fit comfortably into), were viewed in the design world as the tawdry stepchild of true literature
and design, gaudy and unsophisticated. I came to understand that this was due to the fact that mass-market books, sold extensively in super markets and convenience stores, had more in common with soap detergent
something about type and image. Indeed, in my short tenure there, I employed more display typefaces in a year and a half than I will in the rest of my lifetime. And, I abused type more then I ever dreamed possible. There, type was always condensed or stretched so the height would be wore elegant and sophisti- thermography, and even greater in a small format. cated jackets. Next in line holography), all designed The problem was the face in terms of standing, in to jump out at you and both the literary and deinto your shopping cart as itself became distorted, as if it was put on the sign worlds, was the trade you walk down the aisle. inquisitionist rack, with paper edition, a misnoThe tradition of massthe horizontals remaining mer that does not refer market covers had more “thick” and the verticals to a specific audience in common with, and, within an area of work, perhaps, for the most part thinning out. Back then, but, rather, to the second is the descendant of, pulp when type was “spec’d” edition of the hardcover, magazine covers of earlier and sent out to a typesetor first edition, that sports decades, with their color- ter, there was a standing a paperbound cover. Trade ful titles and over-the-top order at the type house to condense all type and paperbacks usually utilize illustrations, than that of extend it by hand, which the same interior printits more stylish, larger, ing as the hardcover, and and more expensive cous- created less distortion but still odd-looking faces. are roughly the same size ins. Once, I was instructed by (generally, 6”x9”). the art director to cut the Mass- market books What I Learned serifs off a face, to suit were not so lucky. The his whim. It’s a good ting interior pages of the origo, when I made my there is no criminal proseinal edition were shrunk entry into the elite world cution for type abuse. down, with no regard for of literature, I began in the final type size or the eyes of the viewer. The in- the “bullpen” of massteriors tended to be print- market house. I believed I would be afforded a good ed on cheap paper stock, opportunity to learn prone to yellowing over and cereal boxes then with their much more dignified older brother, the hardcover first edition book. Indeed, the level of design of paperbacks was as slow to evolve as a box of cheerios. On the other hand, hardcover books, as if dressed in evening attire,
time. The edges were often dyed to mask the different grades of paper used. The covers were usually quite loud, treated with myriad of special effects (i.e., gold or silver foil, embossing and de-bossing, spot lamination, die cut, metallic and Day-Glo pantone colors,
S
4
The art director usually commissioned the art for these titles. Therefore, the job of the designers was to find the “appropriate” type solution that worked with these illustrations to create the package. It was here that I learned my earliest lessons in the clichés of typography. Mass- market paperbacks are divided into different genres, distinct categories that define their audience and subject matter. Though they were unspoken rules, handed down from generation to generation, here is what I learned about type during my employ: Typefaces | Genre
And so it went. Every month, we were given five to six titles we were responsible for, and every month, new variations on old themes hung up on the wall. For a brief period I was assigned all the romance titles, which, themselves, were divided into subgenres (historical, regency, contemporary, etc.) I made the conscious decision to create the very best romance covers around. Sure, I would use script and cursive type, but I would use better script and cursive type, so distinctive, elegant, and beautiful that I, or anyone else, would recognize the difference immediately. (When, six months after Square serif // Western I left the job, I went to Script and cursive // view my achievements at Romance the local K-Mart, I could LED faces // Scinot pick out any of my deence Fiction signs from all the rest on Nueland // African (in the bookracks.) spite of the Fact that the Soon after, I gradutypeface is of German ated to art director of a origin) small publishing house. Latin // Mystery The problem was, I still Fat, round serknew little of and had if faces // Children’s little confidence in, typogSan serif // Nonfiction raphy. However, by this Hand scrawl // Horror 1950s bouncy type // Hu- time, I knew I knew little mor/Teen titles about typography. My
5
solution, therefore, was to create images that contained type as an integral part of the image, in a play on vernacular design, thereby avoiding the issue entirely. Thus began a series of collaborations with talented illustrators and photographers, in which the typography of the jacket was incorporated as part of the illustration. Mystery books especially lent themselves well to this endeavor. A nice ting about this approach is that it has a certain informality and familiarity with the audience. It also made my job easier, because I did not have to paste up much type for the cover( as one had to do back in the days of t-squares and wax), since it was, for the most part, self-contained within the illustration. This may seem like laziness on my part, but hey, I was busy. Eventually, my eye began to develop, and my awareness and appreciation of good typography increased. I soon learned the pitfalls that most novice designers fall into, like utilizing a quirky novelty
face does not equal creativity and usually calls attention to the wrong aspects of the solution. . The importance of good letterspacing became paramount. Finding the right combination of a serif and sanserif face to evoke the mood of the material within was now my primary concern. The beauty of a classically rendered letterform now moved me, to quote Eric Gill, as much “as any sculpture or painted picture.” I developed an appreciation for the rules of typography. The Rules
A
s I’ve said, it is a common mistake among young designers to think a quirky novelty face equals creativity. Of course, this couldn’t be farther from the truth. If anything, for the viewer, it has the opposite of the intended effect. Rather than being the total sum of individual expression, it simply calls attention to itself, detracting from, rather than adding to, the content of the piece. It is no substitute for a
well-reasoned conceptual solution to the design problem at hand. As a general rule, no more than two faces should be utilized in any given design, usually the combination of a serif face and a sans serif face. There are thousands to choose from, but I find I have reduced the list to five or six in each category that I have used as body text throughout my career:
should be treated with respect. There are thousands of condensed faces to choose from without resorting to horizontal and vertical scale functions. Do not use text type as display. Even though the computer will enlarge the top beyond the type designer’s intention, this may result in distortions. Do not use display type as text. Often, display type that looks great large can be difficult to read when Serif small. Bodoni The result is odd-lookCaslon ing spacing that looks as Cheltenham if it is about to tumble on Garamond top itself. The thinness of the letter I is no match San Serif for the heft of an O sitting Franklin Gothic on top of it. As always, Futura there are ways to achieve Gill Sans stacking successfully, but New Gothic this requires car. Also, as Trade Gothic I noted, much care should be given to letterspaceYou should never coning the characters of each dense or extend type. As I word. ₪ stated, this leads to unwanted distortions. Much care and consideration went into the design of these faces, and they
6
This is not as simple as it seems. The computer settings for type are rife with inconsistencies that need to be corrected optically. Certain combinations of letterforms are more difficult to adjust than others. It is paramount that even optical (as opposed to actual) spacing is achieved, regardless of the openness or closeness of the kerning. It helps if you view the setting upside down, or backwards on a light box or sun-filled window, or squint at the copy to achieve satisfactory spacing. I would caution you in the judicious use of drop shadows. Shadows these days can be rendered easily in programs such as Adobe’s Photoshop and Illustrator, and convincingly, too. The problem is, it is so easily done that it is overdone. Thus, the wholesale usage of soft drop shadows has become the typographic equivalent to clip art. Viewers know they have seen it before. Rather than being evocative, it mainly evokes the program it was created in. 7
Hard drop shadows, ones that are 100 percent of a color, are easily achieved in Quark and placed behind the main text. This method is generally employed when the main text is not reading against the background, because of a neutral tone or an image that varies in tone from dark to light. The handed-down wisdom is: If you need a drop shadow to make it read, the piece isn’t working. These solid drop shadows always look artificial, since, in reality, there is no such thing as a sold drop shadow. There should be a better solution to readability. Perhaps the background or the color of the type can be adjusted. Perhaps the type should be paneled or outlined. There are an infinite number of possible variations. If you must use a solid drop shadow, it should never be a color. Have you ever seen a shadow in life that is blue, yellow, or green? It should certainly never be white. Why would a shadow be 100 percent lighter than what is, in theory, causing
the shadow? White shadows create a hole in the background, and draw the eye to the shadow, and not where you want it to go: the text. Justified texts look more formal than flush left, rag right. Most books are set justified; while magazines are often flush left, rag right. Centered copy will appear more relaxed than asymmetrical copy. Large blocks of centered type can create odd-looking shapes that detract from the copy contained within. Another thing is to consider the point size and width of body copy. The tendency in recent times is to make type smaller and smaller, regardless of the intended audience. However, the whole purpose of text is that it be read. A magazine covering contemporary music is different from the magazine for The American Association of Retired Persons It is also common today to see very wide columns of text, with the copy set at a small point size. The problem is that
a very wide column is hard to read because it forces the eye to move back and forth, tiring the reader. On the other hand, a very narrow measure also is objectionable, because the phrases and words are too cut up, with the eye jumping from line to line. We, as readers, do not read letter-by-letter, or even word-by-word, but rather phrase-byphrase. A consensus favors and average of ten to twelve words per line. Lastly, too much leading between lines also makes the reader work too hard jumping from line to line, while too little leading makes it hard for the reader to discern where on line ends and another begins. The audience should always be paramount in the designers approach, and it is the audience---not the whim of the designer, or even the client---that defines the level of difficulty and ease with which apiece is read. As Eric Gill said in 1931, “A book is primarily a thing to be read.�
8
A final consideration is the size of the type. As a rule of thumb, mass-market books tend to be 8 point for reasons of space. A clothbound book, magazine, or newspaper usually falls into the 9.5 point to 12-point range. Oversized art books employ larger sizes---generally, 14 point to 18 point or more. Choosing the right typeface for your design can be time-consuming. There are thousands to choose from. Questions abound. Is the face legible at the setting I want? Does it evoke what I want it to evoke? Is it appropriate to the subject matter? There are no easy answers. When a student of mine used Clarendon in a self-promotion piece, I questioned why he chose a face that has 1950’s connotations, mainly in connection with Reid Miles’ Blue Note album covers. He answered, “Because I thought it was cool.” I lectured him profusely on selecting type based on its “coolness.” Later, I relayed the incident to Seymour Chwast, 9
of the legendary Pushpin Group (formerly pushpin studios). He observed that Clarendon is actually a Victorian face, which he and his peers revived as young designers in the 1950s. When I asked him why they chose to bring this arcane face back to life he replied, “Because we thought it was cool.” Breaking the Rules
O
f course, there are always exceptions to the rules. An infinite number of faces can be used within one design, particularly when you employ a broadside-style type solution, a style that has developed with the wood type settings of the nineteenth century. Another style, utilizing a myriad of faces, is that influenced by the Futurist and Dada movements of the early twentieth century. As Robert N. Jones stated in an article in the May 1960 issue of Print magazine: “It is my belief that there has never been a typeface that is so badly designed that it could not be handsomely and effectively
used in the hands of the right…designer.” Of course, this was before the novelty type explosion that took place later that decade, and, again, after the advent of the Macintosh computer. Still, Jeffery Keedy, a contemporary type designer whose work appears regularly in Émigré, concurs: “Good designers can make use of almost anything. The typeface is the point of departure, not the destination.” Note the caveat “almost.” Still, bad use of good type is much less desirable than good use of bad type. When I first began in publishing, a coworker decided to let me in on the “secrets” of picking the appropriate face. “ If you get a book on Lincoln to design,” he advised, “look up an appropriate typeface in the index of the type specimen book.” He proceeded to do so. “Ah, here we go---‘Log Cabin!’” While, on the extremely rare occasion, I have found this to be a useful method, it’s good general rule of what not to do. ₦
Top Ten Fonts
Presented by The Gaurdian, winner of the Pulitzer prize, these are the top 10 picks of greatest typefaces existing prior of 2014.
10
Must See Posters
Story of Peter Bankov’s Poster a Day Steve Heller Writter for the Type Directors Club
11
Peter Bankov makes one poster every day. Them’s a lot of posters. And they are good, too. His sense of abandon makes him one of the strongest poster makers today. Originally from Minsk, Belarus, Bankov’s posters are the focus of an exhibition opening Dec. 2 (with a talk by the designer) at the Type Directors Club NYC. It is a must-see poster show. Bankov presently divides his time between Moscow and Prague. In 1993, he founded Neuch (roughly translated as Ignoramus), an artist’s book collective in Moscow.
He went on to establish, in 1997, both Design Depot, one of Russia’s leading design firms, and kAk magazine, the longest-running and most influential design periodical in the former Soviet Union. Lately, Bankov keeps busy with his Daily Poster project, having created over 500 pieces to date. He has received upwards of 200 design awards, the most recent of which include the Platinum Award from Graphis Poster Annual; First Prize in the World War 1: 100 exhibition in Nizhny Novgorod, Russia; and Grand-Prix from the Asian Graphic Design Invitational Exhibition in Seoul, South Korea.
Peter Bankov
The exhibition of his work is at the TDC gallery from Dec. 2 to Jan. 31, and is curated by Misha Beletsky and can be seen by appointment (contact Carol Wahler, director@tdc.org)
12
abcdefg
clarity
abcdefghijklmnopqrstuvwxyz
Photo by Myself Photos & Article by: Danny Davis Editor & Designer of Baseline Magazines
13
Situation
O
ur goal was to take a select destination in the downtown St. Augustine area and turn it into common ground for passer-byes to stop and receive some insight to the
role type has played in the history of St. Augustine. By constructing 3ft letters made out of Q-tips we choose to convey our message with the word Clarity.
Project Budjet Q-Tips (purchased over10,00)
$50
Paper & Print
$27
Plastic Wrap
$7
Fishing line (3 Spools)
$14
Team Matt Dolby Plan Seeker & Organizer
Danny Davis (myself) Productive Interpreter
Dolby made sure the group had a well thought strategy before jumping into decisions. By making sure we knew how to go about performing various little tasks, he made sure the project was done in the way needed for it actually to be pulled off.
When group members became unsure I helped to resolve for reasonable solution. This helped make time more worthwhile by keeping members on task and everyone on the same page.
Meghan Johnson The Boundless Mind
Clear packing tape
$6
Glue sticks
$30
Meghan was always able to come up with hundreds of ideas to complete a task and though many were just ideas, some became innovative solutions to answers. She was the energetic, dream big attitude that shaped the project into become what it was.
10,000
Jamie Mattson Volunteer Though not in the group Jamie showed up a sufficient amount acting as a well needed 4th pair of hands. This helped our work pace but also made much of the project possible, for example hanging up those giant flimsy letters took a lot of hands. It took just as many as 2 or 3 of us to hold a letter up, let alone hang it.
QTips 14
T
he first step in this project was to figure out a way to summarize the impact created by typography with just one word. After deciding upon a word we had to then figure out an object that tied with our word, which could also be used as a pixel to create this lifesized word that could be visible from a distance. Finally we simply needed a spot that could properly display our word; desirably easily visible in a high traffic area where people can stop and view our work. We thought the word clarity fit more than appropriately when describ-
Type gives us a precise visual representation of communicating and is useable in a wide variety of mediums. Such as in our case we came to a conclusion, that the typeface we choose to design our word with would work best with a small pixel. Before we landed on clarity we had words like insight and dynamic on our minds as well. We kept the 3 an option and tried working out a message for each word with relating pixels that could be used. Once the idea of using Q-tips for clarity was brought to the table we knew we found our pair. We saw it like they had a sort of ironic play
Photo by Myself 15
Photo By Myself off of one another. Obviously people clean their ears with Q-tips, clearing hearing, which helps them listen. Much of which can just be a lot of mindless spoken nonsense. But where type lies apart is it can communicate more thoughtfully. So by using Q-tips we’re trying to make our message more clear and hopefully make other appreciative of type. To create our word with we knew we had to use the typeface Pivot designed by our own team member Meghan. With its unique design, open feel, and clean legibility it was a suitable fit for clarity. After sampling different ways of using the Q-tips
Early Illustration Designs
on illustrator we knew we were going to need an extremely large amount. We found our spot out front from the Flagler College Library, where we wanted to suspend it off ground between two trees. Once the idea was definite, the real work began. We had to figure out a way in which creating our words would be possible. We originally didn’t have a clue how to even use the Q-tips. Once used explored many different possibilities using illustrator, we came up with our
Photo by Myself Setting up letters C & L
most logical solution. We choose to lay the Q-tips flat so they could be easier seen, and in the sections that opened in the type face, we would go 3 Q-tips wide. After some long discussion we had the thought that the letters could be placed on a sheet of plastic wrap, glued down, and cut out resembling the letters. After assembling the materials we started to get to work. The plan was to print out our letters in a large-scale tile mode on 11 x 17’s and tape them 16
ends of the Q-tips attaching to the plastic. We then cut out each letter after they dried so we had giant flimsy letters made of plastic and Q-tips. So we started to load clear packing tape on the back of the letters (plastic side) to reinforce and help make the letters sturdy. With the letters all done we had to head to our
Photo by Myself
to the floor. Plastic wrap was then cut and taped tightly over top. Next we had to spend countless hours uncomfortably lying Q-tips precisely to the floor. Rulers were used not only to lie the Q-tips straight but while 1 person glued, another used a second ruler to hold the Q-tips still. When it came to making out turns we had to begin using a method we termed stacking. On one end of the Q-tips they lied side by side, but on the opposite end we had to stack the ends neatly in pyramid forms. We glued on the 17
spot and start putting up a net of fishing line between 2 trees. We tied the fishing line tight and parallel to the ground. Once we had enough line up we had to hold up the still fragile letters against the fishing line while someone was on the other side of the “web” taping. Most of the time a ladder was necessary. It was a task that was simpler with more hands. All in all every step in this project became a challenge that needed overcome. The whole experience was a learning process. From little things like every time we printed our letters it used hundreds of sheets most of which were blank. That alone turned into a
Photo by Myself
couple hour project. Even figuring out best methods for creating the letters from things like having to invent stacking. It was a constant collaboration because if people weren’t on the same page we couldn’t have made the outcome we turned out with. ₣
Document window overview 4 Steps 1.) Choose File > New > Document. The New Document dialog box combines the Document Setup and the Margins And Columns dialog boxes, so that you can set up the page size, margins, and page columns all in one place. You can change these settings at any time. 2.) Specify document setup options. (See New Document options.) To specify the dimensions of the bleed and slug areas, click the Arrow button before the Bleed and Slug label. The bleed and slug areas extend out from the edges of the defined Page Size. To make the bleed or slug areas extend evenly on all sides, click the Make All Settings The Same icon 3.) (Only in InDesign CC) Select the Preview checkbox to see how your new document will look like. Make necessary changes if required. 4.) Click OK to open the new document with the settings you specified.
Creating New Documents in inDesign with David Blatner of Adobe help
Each page or spread in your document has its own pasteboard and guides, which are visible in Normal View mode. (To switch to Normal View, choose View > Screen Mode > Normal.) The pasteboard is replaced with a gray background when the document is viewed using one of the Preview modes. (See Preview documents.) You can change the color of this preview background and guides in Guides & Pasteboard preferences.
A. Spread (black lines) B. Page (black lines) C. Margin guides (magenta lines) D. Column guides (violet lines) E. Bleed area (red lines) F. Slug area (blue lines) by David Blatner
18
Grooming The Font Robert Bringhurst Designer Writer & Typographer
W
riting begins with the making of meaningful marks. That is to say, leaving the traces of meaningful gestures. Typography begins with arranging meaningful marks that are already made. In that respect, the practice of typography is like playing the piano – an instrument quite different from the human voice. On the piano, the notes are already fixed, although their order, duration and amplitude are not. The notes are fixed but they can be endlessly rearranged, into meaningful music or meaningless noise. 19
Pianos, however, need to be tuned. The same is true of fonts. To put this in more literary terms, fonts need to be edited just as carefully as texts do – and may need to be re-edited, like texts, when their circumstances change. The editing of fonts, like the editing of texts, begins before their birth and never ends. You may prefer to entrust the editing of your fonts, like the tuning of your piano, to a professional. If you are the editor of a magazine or the manager of a publishing house,
that is probably the best way to proceed. But devoted typographers, like lutenists and guitarists, often feel that they themselves must tune the instruments they play.
change. The Linotype Library’s standard font license says that “You may modify the Font’ Software to satisfy your design requirements.” FontShop’s standard license has a similar Legal Considerations provision: “You do have Check the license before the right to modify and tuning a digital font alter Font Software for Digital fonts are usuyour customary personally licensed to the user, al and business use, but not sold outright, and the not for resale or further license terms may vary. distribution.” Adobe’s and Some manufacturers Agfa Monotype’s licensclaim to believe that imes contain no such proproving a font produced vision. Monotype’s says by them is an infringeinstead that “You my not ment of their rights. No alter Font Software for one believes that tuning the purpose of adding any a piano or pumping up functionality.... You agree the tires of a car infringnot to adapt, modify, ales on the rights of the ter, translate, convert, or manufacturer – and this otherwise change the Font is true no matter whether Software….” the car or the piano has If your license forbids been rented, leased or improving the font itself, purchased. Printing type the only legal way to tune was treated the same it is through a software way from Bi Sheng’s time override. For example, until the 1980s. Generalyou can use an external ly speaking, metal type kerning editor to override and phototype are treated the kerning table built that way still. In the digiinto the font. This is the tal realm, where the font least elegant way to do it, is wholly intangible, those but a multitude of errors older notions of ownerin fitting and kerning can ship are under pressure to be masked, if need be, by
this means. Ethical and Aesthetic Considerations If it ain’t broke…. Any part of the font can be tuned – lettershapes, character set, character encoding, fitting and sidebearings, kerning table, hinting, and, in an OpenType font, the rules governing character sub-situation. What doesn’t need tuning or fixing shouldn’t be touched. If you want to revise the font just for the sake of revising it, you might do better to design your own instead. And if you hack up someone else’s font for practice, like a biology student cutting up a frog, you might cremate or bury the results. If the font is out of tune, fix it once and for all. One way to refine the typography of a text is to work your way through it like by line, putting space in here, removing it there, and repositioning errant characters one by one. But if these refinements are made to the font itself, you will never need 20
to make them again. They are done for good. Respect the text first of all, the letterforms second, the type designer third, the foundry fourth. The needs of the text should take precedence over the layout of the font, the integrity of the letterforms over the ego of the designer, the artistic sensibility of the designer over the foundry’s desire for profit, and the founder’s craft over a good deal else. Keep on fixing. Check every text you set to see where improvements can be made. Then return to the font and make them. Little by little, you and the instrument – the font, that is – will fuse, and the type you set will start to sing. Remember, though, this process never ends. There is no such thing as a perfect font. Honing The Character Set If there are defective glyphs, mend them. If the basic lettershapes of your font are poorly drawn, it is 21
probably better to abandon it rather than edit it. But many fonts combine superb basic letterforms with alien or sloppy supplementary characters. Where this is the case, you can usually rest assured that the basic letterforms are the work of a real designer, whose craftsmanship merits respect, and that the supplementary characters were added by an inattentive foundry employee. The latter’s
errors should be remedied at once. You may find for example that analphabetic characters such as @ + ± × = � - − © are too big or too small, too light or too dark, too high, or too low, or are otherwise out of tune with the basic alphabet. You may also find that diacritics in glyphs such as XXXXXX are poorly drawn, poorly positioned, or out of scale with the letterforms.
Jose Mendoza y Almeida’a Photina is an excellent pice of design, but in every wight and style of Monotype digital Photina, as issued by the foundry, arithmetical signs and other analphabetics are out of scale ande out of position, and the copyright symbol and at sight are alien to the font. The raw versions are shown in grey, corrected versions in black.
If text figures, ligatures or other glyphs you need on a regular basis don’t reside on the base font, move them. For readable text, you almost always need figures, but most digital fonts are sold with titling figures instead. Most digital fonts also include the ligatures fi and fl but not ff, ffi, ffl, fj or ffj. You may find at least some of the missing glyphs on a supplementary font (an ‘expert font’), but that is not enough. Put all the basic glyphs together on the base font. If, like a good Renaissance typographer, you use only upright parentheses and brackets (XXX), copy the upright forms from the roman to the italic font. Only then can they be kerned and spaced correctly without
fuss. If glyphs you need are missing altogether, make them. Standard ISO digital text fonts (PostScript or TrueType) have 256 slots and carry a basic set of Western European characters. Eastern European characters such as ą ć đ ė ğ ħ ī ň ő ŗ ș ť ů are usually missing. So are the Welsh sorts ŵ and ŷ, and a host of characters needed for African, Asian and Native American languages. The components required to make these characters may be present on the font, and assembling the pieces is not hard, but you need a place to put whatever character you make. If you need only a few and do not care about system compatibility, you can place them in wasted slots 22
– e.g., the ^ < > \ | ~ ` positions, which are accessible directly from the keyboard, or slots such as ¢ ÷ X X X ™ � X X, which can be reached through insertion utilities or by typing character codes or by customizing the keyboard. If you need to add many such characters, you will need to make a supplementary font or, better yet, an enlarged font (TrueType or OpenType). If these are for your own use only the extra characters can be placed wherever you wish. If the fonts are too be shared, every new glyph should be labeled with its PostScript name and Unicode number. Check and correct sidebearings The spacing of letters is part of the essence of their design. A well-made font should need little adjustment, except for refining the kerning. Remember, however, that kerning tables exist for the sake of problematical sequences such as ƒ*, gy, “A, To, Va and 74. If you find that simple pairs such 23
as oo or oe require kerning, this is a sign that the letters are poorly fitted. It is better to correct the sidebearings than to write a bloated kerning table. The spacing of many analphabetics, however, has as much to do with editorial style as with typographic design. Unless your fonts are custom made, neither the type designer nor the founder can know what you need or prefer. I habitually increase the left sidebearing of semicolon, colon, question and exclamation marks, and the inner bearings of guillemets and parentheses, in search of a kind of Channel Island compromise: neither the tight fitting preferred by most anglophone editors nor the wide-open spacing customary in France. If I worked in French all the time, I might increase these sidebearings further. ₰
Three optoins for the spacing of basic analphaabetics in Montype digital Centaur: foundry issue (top); French spacing (bottom); and something in between. Making such adjustments one by one the inertion of fixed apces can be tedious. It is easier by far, if you know what you want and you want it consistently, to incorporate your preferences into the font.
Refine the kerning table. Digital type can be printed in three dimensions, using zinc or polymer plates, and metal type can be printed flat, from photos or scans of the letterpress proofs. Usually, however, metal type is printed in three dimensions and digital type is printed in two. Two-dimensional type can be printed more cleanly and sharply than three-dimensional type, but the gain in sharpness rarely equals what is lost in depth and texture. A digital page is
therefor apt to look aenemic next to a page printed directly from handset metal. This imbalance can be addressed by going deeper into two dimensions. Digital type is capable of refinements of spacing and kerning beyond those attainable in metal, and the primary means of achieving this refinement is the kerning table. Always check the sidebearings of figures and letters before you edit the kerning table. Sidebearings can be checked, quickly for errors by dis-
abling kerning and setting characters, at ample size, in pairs: 11223344 â&#x20AC;Ś qqwweerrttyyâ&#x20AC;Ś. If the spacing within the pairs appears to vary, or if it appears consistently cramped or loose, the sidebearings probably need to be changed. The function of a kerning table is to achieve what perfect sidebearings cannot. A thorough check of the kerning table therefore involves checking all feasible permutations of characters:
24
: 1213141516 … qwqeqrqtqyquqiqoqp … (a(s(d(f(g(h(j(k(l … )a) s)d)f)g … -1-2-3-4-5 … TqTwTeTrTtTyTuTiToTp … and so on. This will take several hours for a standard ISO font. For a full pan-European font, it will take several days. Class-based kerning (now a standard capability of font editing software) can be used to speed the process. In class-based kerning, similar letters, such as a á â ä à å ã ă ā ą are treated as one kerned alike. This is an excellent way to begin when you are kerning a large font, but not a way to finish. The combination Ta and Tä, Ti and Tï, il and íl, i) and ï), are likely to require different treatment. Kerning sequences such as Tp, Tt and f( may seem to you absurd, but they can and do occur in legitimate text. (Tpig is the name of a town in the mountains of Dagestan, near the southern tip of Russian Federation; Ttanuu is an important historical site on the British Columbia coast; sequences such as y = ƒ(x) occur 25
routinely in mathematics.) If you know what texts you wish to set with a given font, and know that combinations such as these will never occur, you can certainly omit them from the table. But if you are preparing a font for general use, even in a single language, remember that it should accommodate the occasional foreign phrase and the names of real and fictional people, places and things. These can involve some unusual combinations. (A few addition examples: McTavish, FitzWilliam, O’Quinn, dogfish, jock o’-lantern, hallowe’en.) It is also wise to check the font by running a test file – a specially written text designed to hunt out missing or malformed characters and kerning pairs that are either too tight or too loose. It is nothing unusual for a well-groomed ISO font (which might contain around two hundred working characters) to have a kerning table listing a thousand pairs. Kerning instructions for large OpenType fonts are
usually stored in a different form, but if converted to tabular form, the kerning data for a pan-European Latin font may easily reach 30,000 pairs. Remember, though, that the number isn’t what counts. What matters is the intelligence and style of the kerning. Remember too that there is no such thing as a font whose kerning cannot be improved. Check the kerning of the word space. The word space – that invisible blank box – is the most common character in almost every text. It is normally kerned against sloping and undercut
glyphs: quotation marks, apostrophe, the letters A, T, V, W, Y, and often to the numerals 1, 3, 5. It is not, however, normally kerned more than a hair either to or away from a preceding lowercase ƒ in either roman or italic. A cautionary example. Most of the Monotype digital revivals I have tested over the years have serious flaws in the kerning tables. One problem in particular recurs in Monotype Baskerville, Centaur and Arrighi, Dante, Fournier, Gills Sans, Poliphilus and Baldo, Van Dijck and other masterworks in the Monotype
Monotype digital Van Dijck, before and after editing the kerning table. As issued, the kerning table adds 127 units in the roman, and 228 and the italic, between the letter f and the word space. The corrected table adds 6 units in the roman, none in the italic. Other, less drastic refinements have also been made to the kerning table using in the second two lines.
collection. These are well-tried faces of suberb design – yet in defiance of tradition, the maker’s kerning tables call for a large space (as much as M/4) to be added whenever the ƒ is followed by a word space. The result is a large white blotch after every word ending in ƒ unless a mark of punctuation intervenes. Professional typographer may argue about whether the added space should be zero, or ten, or even 25 thousandths of an em. But there is no professional dispute about whether it should be on the order of an eighth or a quarter of an em. An extra space that large is a prefabricated typographic error – one that would bring snorts of disbelief and instantaneous correction from Stanley Morison, Bruce Rogers, Jan van Krimpen, Eric Gill and others on whose expertise and genius the Monotype heritage is built. But it is an easy error to fix for anyone equipped with the requisite tool: a digital font editor. ₢ 26
Hinting If the font looks poor at low resolutions, check the hinting. Digital hints are important chiefly for the sake of how the type will look on screen. Broadly speaking, hints are of two kinds: generic hints that apply to the font as a whole and specific hints applicable only to individual characters. Many fonts are sold unhinted, and few fonts indeed are sold with hints that cannot be improved. Manual hinting is tedious in the extreme, but any good font editor of recent vintage will include routines for automated hinting. These routines are usually enough to make a poorly hinted text font more legible on screen. (in the long run, the solution is high-resolution screens, making the hinting of fonts irrelevant except at tiny sizes.)
27
Naming Conventions The presumption of common law is that inherited designs, like inherited texts, belong in the public domain. New designs (or in the USA, the software in which they are enshrined) are protected for a certain term by copyright; the names of the designs are also normally protected by trademark legislation. The names are often better protected, in fact, because infringements on the rights conferred by a trademark are often much easier to prove than infringements of copyright. Nevertheless there are times when a typographer must tinker with the names manufacturers give to their digital fonts. Text fonts are generally sold in families, which may include smorgasbord of weights and variations. Most editing and typesetting software takes a narrower, more stereotypical view. It recognizes only the nuclear family of roman, italic, bold and bold italic. Keyboard shortcuts make it easy to switch from one to
another of these, and the switch codes employed are generic. Instead of saying “Switch to such and such a font at such and such a size,” they say, for instance, “Switch to this font’s italic counterpart, whatever that may be.” This convention makes the instructions transferable. You can change the face and size of a whole paragraph or file and the roman, italic and bold should all convert correctly. The slightest inconsistency in font names can prevent this trick from working – and not all manufacturers name their fonts according to the same conventions. For the fonts to be
linked, their family names must be identical and the font names must abide by rules known to the operating system and software in use. If, for example, you install Martin Majoor’s Scala or Scala Sans (issued by FontShop) on a PC, you will find that the italic and the roman are unlinked. These are superbly designed fonts, handsomely kerned and fully equipped with the requisite text figures and small caps – almost everything a digital font should be – but the PC version must be placed in a font editor and renamed in order to make them work as expected. ₫
28
Typographic hierarchy is another form of visual hierarchy, a sub-hierarchy per se in an overall design project. Typographic hierarchy presents lettering so that the most important words are displayed with the most impact so users can scan text for key information. Without typographic hierarchy, every letter, every word and every sentence in a design would look the same. Can you imagine reading something where everything is the same font and size and color? Where do you start? How do you know what matters most? Typographic hierarchy creates contrast between elements. Designers achieve this through the use of typefaces, size, weight, capital and lowercase letters, bold or italics, orientation and color. Combinations of those design tools are used to create type that falls into distinct layers.
Design Shack.com 29
Every Deisgn needs 3 Levels of Typographic Hierarchy By Carrie Cousins of Design Shack Primary Level The primary level of typography is all of the big type. It’s headlines and decks – also known as “furniture” – that draw readers into the design. This is the biggest type in the design (unless you are using typographic art). Secondary Level The secondary level of typography are the nuggets of scannable information that help readers stay with the design. This includes elements such as subheads, captions, pull quotes, infographics and other small blocks of text that add information to the primary level of text. The design of these text blocks is on the large side, but typically much smaller than lettering in the primary level of typography.
Tertiary Level The tertiary level of typography is the main text of your design. It is often some of the smallest type in the design, but it needs to be large enough to be completely readable by all potential users. The type-
and for only a few words in sequence. Examples of other levels include links that are underlined, bold words for impact or italics or color for emphasis.
face should be simple and consistent in design, spacing and overall usage. Other Levels The other levels of typography include effects applied to type in the tertiary level for small areas of impact. Effects such as bolding, italics, underlining and color can bring attention to specific areas of the main text. These effects work best when applied to text of the same size and typeface used in the tertiary level. Effects are used sparingly 30
Work With Type in inDesign Jo Gulliver, Computer Arts’ PPA Designer, give 10 valuable tips working with typography in inDesign.
31
1 The majority of type-
2 Found in the flyout
3 The Underline Options
faces, particularly serifs, will contain ligatures. For letters that would normally sit uncomfortably next to each other, such as a lowercase ‘f’ next to an ‘i’ or ‘l’, InDesign has a Ligature option in the Control panel menu. When selected, this will automatically address the problem by replacing the characters with a ligature, which is a special character that ties the letters together.
menu of the Control panel, the Underline Options dialog box can be used to adjust the alignment and appearance of any underline. By default, the stroke weight of an underline is based on the point size of the text. These options prove particularly useful when you want to apply a consistent underline to sections of text containing different sizes of type.
dialog box also provides a great way to apply a highlight to text. By selecting a bright or contrasting colour, increasing the weight and decreasing the offset, you can create a highlight colour to sit behind the text. This is in contrast to the Strikethrough option, also found in the Control panel flyout menu, where the line sits on top of the text hiding, what’s below.
4 The No Break option in the Control panel flyout menu works by tying together words that need to stay linked within flowing copy. A better alternative to this is The Nonbreaking Space (Ctrl/Cmd+Alt+X) found under the Type>Insert White Space submenu. Unlike No Break, this applies a hidden character, making it easier to spot when editing text at a later date.
comes in handy. To use it, first align the whole paragraph to the baseline grid, and then choose Only Align First Line to Grid from the Paragraph or Control panel menu.
7 Found under Type> Sto-
ry, Optical Margin Alignment is a great way to tidy up the vertical alignment of text when you have uncomfortable spacing caused by punctuation. It works by adjusting where the punctuation sits in reAdobe Paragraph and lation to the other characAdobe Single-line Comters, by shifting it into the poser are alternative ways gutter. It also adjusts any of controlling copy flow. overhanging characters, The Single-line Composer so you’ll need to experiadjusts the spacing and ment with the point size hyphenation on a line-byto get it all looking nice. line basis, and Paragraph You can apply it on a paramakes these changes graph-by-paragraph babased on the requiresis: turn it on and off via ments of the paragraph. the Ignore Optical Margin The best option to choose option in the Control panel depends on the length of menu. your copy. The Keep Options I tend to align all flowfunctions is a great way ing body copy to the baseof controlling copy flow, line grid to keep it confound again in the Control sistent throughout the panel. Use the Next Line magazine, but if you need feature to keep subheadto add copy that breaks ings tied with body copy. this grid, such as a boxout Enter the required numor caption, the Only Align ber of lines you wish to First Line to Grid option link in the text field. This
5
6
8
will push the paragraph onto the next column or page if necessary.
9 The Keep Lines Together feature enables you to keep a whole paragraph together, so that no break will appear. Alternatively, you can control the number of lines at the start or end of a paragraph that will be linked together, which is a good way to manage widows and orphans. Also, the Start Paragraph option lets you choose where the next paragraph starts, whether it’s the next column, next page, next even page, and so on.
10 An alternative way of
controlling the flow and breaks in copy is to go to Type>Insert Break Character. Here you have the same options as those in Keep Options>Start Paragraph, but these can’t be applied to paragraph styles. ₪
32
Back to Basics: Stopping Sloppy Typography John D. Berry
33
T
billboard, it’s a witty comhere’s a billboard ment on the fact that you along the freeway in San are looking at “me”—that Francisco that’s entireis, the message on the ly typographic, and very billboard—as you drive simple. Against a bright past. blue background, white But, as my partner and letters spell out a single I drove past and spotted short line, set in quotation this billboard for the first marks: “Are you lookin’ time, we both simultaneat me?” The style of the ously voiced the same reletters is traditional, with sponse: “No, I’m looking serifs; it looks like a line at your apostrophe!” of dialogue, which is exThe quotation marks actly what it’s supposed around the sentence are to look like. Since this is a real quotation marks, billboard, and the text is which blend in with the the entire message of the style of the lettering—
—“typographers’ quotes,” as they’re sometimes called—but the apostrophe at the end of “lookin’” is, disconcertingly, a single “typewriter quote,” a straight up-and-down line with a rounded top and a teardrop tail at the bottom. To anyone with any sensitivity to the shapes of letters, whether they know the terms of typesetting or not, this straight apostrophe is like a fart in a symphony—boorish, crude, out of 34
John D. Berry
Honorary Presedent of Assosciation typographique Internationale editor & publisher of Upper Case and Lower Case
35
place, and distracting. The normal quotation marks at the beginning and end of the sentence just serve to make the loud “blat!” of the apostrophe stand out. If that had been the purpose of the billboard, it would have been very effective. But unless the billboards along Highway 101 have become the scene of an exercise in typographic irony, it’s just a big ol’ mistake. Really big, and right out there in plain sight.
basic typography ought to be part of the education of every graphic designer. But clearly, this isn’t the case—or else a lot of designers skipped that part of the class, or have simply forgotten what they have once learned about type. Or, they naively believe the software they use will do the job for them. Maybe it’s time for a nationwide—no, worldwide—program of remedial courses in using type.
The Devil is in the Details This may be a particularly large-scale example, but it’s not unusual. Too much of the signage and printed matter that we read—and that we, if we’re designers or typographers, create—is riddled with mistakes like this. It seems that an amazing number of people responsible for creating graphic matter are incapable of noticing when they get the type wrong. This should not be so. These fine points ought to be covered in every basic class in typography, and
Automated Errors As my own small gesture toward improvement, I’ll point out a couple of the more obvious problems—in the hope that maybe, maybe, they’ll become slightly less commonplace, at least for awhile. Typewriter quotes and straight apostrophes are actually on the wane, thanks to word-processing programs and page-layout programs that offer the option of automatically changing them to typographers’ quotes on the fly. (I’m not sure what has made the phenomenon I
spotted on that billboard so common, but I’ve noticed a lot of examples recently of text where the double quotation marks are correct but the apostrophes are straight.) But those same automatic typesetting routines have created another almost universal mistake: where an apostrophe at the beginning of a word appears backwards, as a single open quotation mark. You see this in abbreviated dates (’99, ’01) and in colloquial spellings, like ‘em for them. The program can turn straight quotes into typographers’ quotes automatically, making any quotation mark at the end of a word into a closed quote, but it has no way of telling that the apostrophe at the beginning of ‘em isn’t supposed to be a single open quote, so it changes it into one. ₰
36
The only way to catch this is to make the correction by hand—every time. Anemic Type The other rude noise that has become common in the symphony hall is fake small caps. Small caps are a wonderful thing, very useful and sometimes elegant; fake small caps are a distraction and an abomination.
Fake caps are what you get when you use a program’s “small caps” command. The software just shrinks the full-size capital letters down by a predetermined percentage— which gives you a bunch of small, spindle-looking caps all huddled together in the middle of the text. If the design calls for caps and small caps—that is, 37
small caps for the word but a full cap for the first letter—it’s even worse, since the full-size caps draw attention to themselves because they look so much heavier than the smaller caps next to them. (If you’re using caps and small caps to spell out an acronym, this might make sense; in that case, you might want
as the x-height or a litter taller, and with stroke weights that math the weight of the lowercase and the full caps of the same typeface. Make sure you’re using a typeface that has true small caps, if you want small caps. Letterspace them a little, and set them slightly loose, the same way you would (or at least should) with a word in all caps; it makes the word much more readable. Pay Attention, Now There are plenty of other bits of remedial typesetting that we ought to study, but those will do for now. The obvious corollary to all this is, to produce well-typeset words, whether in a single phrase on a billboard or several pages of text, you have to pay attention. Proofread. Proofread again. Don’t trust the defaults of any program you use. Look at good typesetting and figure out how it was done, then do it yourself. Don’t be sloppy. Aim for the best. ₣
Words to live by, I suppose. And, certainly, words to set type by.
the initial caps to stand out. Otherwise, it’s silly. (And—here comes that word again—distracting.) If it weren’t for a single exception, I’d advise everyone to just forget about the “small caps” command—forget it ever existed, and never, ever, touch it again. (The exception is Adobe InDesign, which is smart enough to find the real small caps in an OpenType font that includes them, and use them when the “small caps” command is invoked. Unfortunately, InDesign isn’t smart enough, or independent enough, to say, “No, thanks,” when you invoke “small caps” in a font that doesn’t actually have any. It just goes ahead and makes those familiar old fake small caps.) You don’t really need small caps at all, inmost typesetting situations; small caps are a typographic refinement, not a crutch. If you’re going to use them, use real small caps: properly designed letters with the form of caps, but usually a little wider, only as tall
38
Spine
ClarityG Back to Basics Type Casting rooming the Font
Letter From the Danny Publisher Davis
1st Issue: V. I // December 2014
Baseline is a magazine for those interested in typography. It almost seems to be a dying art, going unnoticed by many however we know there are readers like you who still take interest. Thats our goal, to bring type to the spotlight and emphasize the importance it plays in our community. For our first issue we found it rather essential to start with the basics. Hence many articles and columns gathered for this article was about “stopping sloppy typography” and even some beginer tutorials for starting off in InDesign and working with type. We just hope our readers are able to get out as much as we get out of making this. ₪