Typography Book

101 1

22

WELCOME! THIS IS A GUIDE FOR BEGINNER DESIGNERS WHO ARE LOOKING FOR SOME DIRECTION ON TYPOGRAPHY. WARNING: EXPERIENCED DESIGNERS, YOU MAY KNOW THIS STUFF. 3

34

1. ABCDEFGHIJKLMNOP QRSTUVWXYZabcdefg Try to identify this hijklmnopqrstuvwxyz font by matching the font name in options A A. GILL SANS B. BODONI C. FUTURA D. SABON through D. ABCDEFGHIJKLMNOPQ 2. RSTUVWXYZabcdef ghijk lmnopqrstuvwxyz Try to identify this font by matching the font name in options A through D. A. HELVETICA B. ARIAL C. TIMES D. BASKERVILLE 3. ABCDEFGHIJKLMNOPQRST UVWXYZabcdefghijklmnopqr Try to identify this stuvwxyz font by matching the font name in options A A. MONTSERRAT B. BODONI C. MARKER FELT D. ROCKWELL through D. ABCDEFGHIJKLMNOP 4. QRSTUVWXYZabcdefg hijklmnopqrstuvwxyz Try to identify this font by matching the A. PAPYRUS B. CLARENDON C. BASKERVILLE D. DIDOT font name in options A through D. 45

5. ABCDEFGHIJKLMNOP QRSTUVWXYZabcdefgh Try to identify this ijklmnopqrstuvwxyz font by matching the font name in options A through D. A. COMIC SANS B. BODONI C. SABON D. PLAYFAIR ABCDEFGHIJKLMNOPQ 6. RSTUVWXYZabcdefghij klmnopqrstuvwxyz Try to identify this font by matching the font name in options A through D. A. HELVETICA B. TIMES C. CLARENDON D. MINION PRO 7. ABCDEFGHIJKLMNOPQR ST UVW XY Z a b c d e f g h i j k l m Try to identify this nopqrstuvwxyz font by matching the font name in options A through D. A. FUTURA B. GARAMOND C. GILL SANS D. MINION PRO ABCDEFGHIJKLMNOP 8. Q R ST UVW XY Z a b c d e f g h ijklmnopqrstuvwxyz Try to identify this font by matching the font name in options A through D. A. PAPYRUS B. CLARENDON C. BASKERVILLE D. DIDOT 56

1. ANSWER IS C. THE FONT IS FUTURA. 5. ANSWER IS C. THE FONT IS SABON. Originally created as a contribution to the New Frankfurt project, the Sabon is an old-style serif typeface designed by the German-born geometric sans serif typeface was based on visual elements of the Bauhaus typographer and designer Jan Tschichold (1902–1974) in the period 1964– design style of 1919 to 1933. German typographer Paul Renner designed 1967.The design of the roman is based on types by Claude Garamond. it in 1927. 6. ANSWER IS A. THE FONT IS HELVETICA. 2. ANSWER IS D. THE FONT IS BASKERVILLE. The first version of Helvetica was created in 1957 by Max Miedinger, a Baskerville was designed by John Baskerville in 1757 in England. Swiss typeface designer. Miedinger wanted a font that was clear to the eye Baskerville is classified as a transitional typeface, meaning that it’s style and could be used in a variety of ways. It was originally called Neue Hass was the stepping stone from old style typefaces such as Caslon, to modern Grotesk. In 1960, the typeface's name was changed to Helvetica, which typefaces such as Didot and Bodoni. means “Swiss” in Latin. 3. ANSWER IS B. THE FONT IS BODONI. 7. ANSWER IS C. THE FONT IS GILL SANS. Bodoni typeface is named after its creator, Giamattista Bodoni. He was Gill Sans was released in 1928 by Monotype, initially as a set of titling an expert printer who ran a printing-office under the Duke of Parma. The capitals that was quickly followed by a lower-case. Gill's aim was to blend design of Bodoni's type was permitted by and showcased the quality of his the influences of Johnston, classic serif typefaces and Roman inscriptions company's work in metal-casting, printing and of the paper made in Parma. to create a design that looked both cleanly modern and classical at the same time. 4. ANSWER IS B. THE FONT IS CLARENDON. Clarendon is an English slab-serif typeface that was created in England by 8. ANSWER IS D. THE FONT IS DIDOT. Robert Besley for the Fann Street Foundry in 1845.It was named after the Named after the Didot family, famous as printers and type producers, the Clarendon Press in Oxford. The typeface was reworked by the Monotype foundry in 1935. It was revised by Hermann Eidenbenz in 1953. typeface is based on a collection of related types developed from 1784– 1811 by Firmin Didot. The Didot typeface is characterized by increased stroke contrast, condensed armature, hairline strokes, vertical stress, and 67 flat, unbracketed serifs. It is a Neoclassical serif typeface.

NINE THINGS ABOUT FONTS EVERY DESIGNER KNOWS: 87

Learn the basics. T he first step to more effective typography is to study the art. Typography is pretty complex because it’s a combination of art and science. The composition of a typeface consists of specific vocabulary, accurate measurements, and central specifications that should always be identified and taken into consideration. Like with different design forms, you can pull off breaking a rule only if you know it by heart. And it’s only acceptable if you carry it out on purpose to create something of significance. To get a better understanding on the basics of typography, spend time studying and learning the art. 89

Take note of font communication. T ypeface selection is hardly a random process. Merely searching through your font catalog to choose a font you personally like rarely create an efficient end result. This is because there’s a psychology linked to certain typefaces. When designing, you need to make sure your type is connecting to your audience. This is more than just making certain that your copy is impeccably written. It’s also about ensuring that the font you use fits your market. You wouldn’t use elaborate and rainbow-colored fonts for a law firm brochure, right? That would be better suited for a birthday invitation. 190

Understand Kerning. K erning is a pivotal skill you need to learn right away. A bad kerning job is considered a sin in the design world. While kerning may not sound all that important, a well-done kerning job make a huge difference. Kerning’s main priority is to ensure that the space between characters are aesthetically even to create well-arranged text. Kerning blunders in headlines or logos can instantly ruin the whole design. 1101

Limit your fonts. A common mistake for designers - especially new ones - is to use too many fonts and styles. If you are designing and you need more than one typeface, make sure to stick to just two or three typefaces maximum. Any more than that, and your reader will get a headache. Typically you use one font and size for the body, another for the header, and another for the subhead. Also feel free to choose fonts that are from different type families as long as they pair well together. However, working with two similar fonts may look like a mistake. 121

Practice correct alignment. A lignment is an imperative concept in typography. Some non-designers will choose between Center Aligned and Justified, which makes paragraphs difficult to read. Most MS-Word users are already familiar with the four key alignment options: Left Aligned, Center Aligned, Right Aligned, and Justified. Left Alignment is also called Left Flushed. And Right Alignment is also called Right Flushed. Justified is usually a nightmare for designers. When using both Left and Right Aligned text, make sure to keep an eye out for ragged lines. 1123

Practice typographic heirarchy. T ypographic hierarchy is helpful to emphasize the signifiance or importance of certain lines of type when compared to others. Ultimately, you establish and create the order or sequence in which the readers receives information from the design. Essentially you guide the movement of a reader’s eyesight through visual hierarchy. Without typographic hierarchies, readers becomes challenged to easily identify which pieces ofinformation to take in within the 143 whole design.

Work with grids. Grids are critical in design and should be emphasied more. Using a grid helps ensure everything on the page is cohesive and produces logical and visual harmony. All in all, grids make everything appear cohesive and interconnected. However, you do not have to use a grid every time you create something. Regardless, grids can aid a lot if you understand how and why grids are used, especially when typography is involved. 1145

Practice smart pairing. T hrough typeface pairing, you can make your layout look more compelling. However, avoid using too many fonts at the same time because that can get distracting for the reader. Furthermore, an overload of fonts can confuse the audience on which element of the design is the priority. Overall, you should refrain from too many fonts and use a maximum of three fonts per design: the title, the subhead, and the body of text. Of course, there is an exception if your design text us very long. If this is the case, you many choose one or two more fonts. 165

Pick a secondary font for pairing. W ow, so it’s time to pick a font to pair with your original font? How exciting! Font pairing is critical to the readability of your design. When you have both a heading and a subhead, use two separate typefaces that complement each other in effort to establish visual hierarchy. When font pairing, avoid using two contradictory fonts or two similar fonts. The secondary font should be as captivating as the primary typeface without losing consistency or uniformity of the design. 1167

187

EXERCISE 1 Design a word out of type.. Use one of the following words provided below. 1. LIQUOR 6. WINDY RULES: 2. CAMERA 7. BICYCLE 3. SHIPWRECK 8. GARDENING 1) No colors 4. COWBOY 9. MOVIE 2) Focus on embellishing 5. LIBRARY 10. ELECTRICITY type. Additional illustrative flourishes should be kept to a bare minimum. EXAMPLE: EXERCISE 2 Pair your last name with your hometown. EXERCISE 3 Retrace this font (right) in Adobe Illustrator. 1189

1209

2201