لطفا منتظر باشید ...
Golden Mean: Method and creativity combined to create typographic balance
Douglas Bowman, Designerwww.csszengarden.com/017[View full size image]
WHEN SITTING DOWN to work on his contribution to the CSS Zen Garden, designer Douglas Bowman recognized that even though he wasn't designing a full-scale project, the process he was following was essentially the same one he uses for larger, real-world projects.Golden Mean demonstrates how typography is as much a part of the Web design workflow as it is with any other form of graphic arts, and that design is a combination of inspiration, technical details, and process.Selecting Type
Having already spent time thinking through the content and ideology behind the actual page, and sketching out potential layouts for it, Bowman was ready to dig into the typography.While type choices might seem to have secondary importance to such elements as imagery and color use, experienced designers are well aware that successful design is the culmination of many factors. One of those factors is the impact of type. Even though it is often subliminal or subtle to most people, type choice influences a design in profound ways. Type can inspire a wide range of moods, including:HumorStoicismWildnessWhimsyNostalgia
If there's an emotion you can add, it's highly likely there's a typeface or combination of faces that can evoke that emotion. Because of this critical impact, it behooves the designer to explore type options for a given design with as much sincerity and creativity as possible.
Experimenting in Illustrator
To make his type selection, Bowman turned to Adobe Illustrator. He used the software along with his considerable knowledge of typography to match the faces to the graceful mood he wished to express in his design.FIGURE 1 is extracted from the original experiments that Bowman did for Golden Mean. Looking for something that he believed to best characterize clever, fun, and unique design took some time. Notice, though, that he used the actual headers from the site: "CSS Zen Garden" and "The Beauty of CSS Design." Previewing with the actual type you're setting helps you to visualize not only the typeface itself, but the overall context, too.
Figure 1. Experimenting with numerous typefaces in the process of developing Golden Mean.
[View full size image]
Figure 2. The Morpheus typeface.
Finding the Tension
Bowman also required a contrasting typeface to create some visual tension, and spark further interest in the overall look. He chose Helvetica to use alongside Morpheus. Helvetica is a quintessentially modern sans-serif typeface that contrasts well with Morpheus; a bridge between a gothic mood and a modern one is created, which adds a lot of appeal to the work (FIGURE 3). Other contrasts with typeface include mixing Verdana, a sans-serif face, with a lowercase serif face, Georgia, in the link lists (FIGURE 4). To ensure the links remained lowercase, Bowman used the text-TRansform property with a value of lowercase as follows:
#linkList #lselect a.c:link, #linkList # #lselect a.c:visited {
display:inline;
font-family:Georgia,Serif;
font-weight:normal;
color:#616623;
background-color:transparent;
text-transform:lowercase;
}
Figure 3. Header from Golden Mean combining Morpheus and Helvetica.
Figure 4. Verdana and Georgia in use in the link list. Note that all the Georgia type is set to lowercase, while the Verdana face is set in normal, title case.
Figure 5. Notice the use of normal and italic Georgia in the body and preamble sections, as well as the graphic type choices within the headers.
[View full size image]
Control Over Anti-Aliasing
www.wpdfd.com/wpdtypo3).TipWhile you should feel free to experiment with multiple type families and faces, typically speaking it takes a very experienced type designer to get away with using multiple families well. This is especially true when mixing more than one family. When in doubt, simplicity is always a good option.
Getting into Typography
If all of this talk about typography is making you hungry for more information, don't worry! There's an abundance of excellent material in both print and online form.
Books
The next time you are out and about, stop by your favorite bookstore and spend some time in the design section. You're sure to find any number of typerelated books. Some will be historical, others will be about type design, and still others will feature the work of a particular type designer. Simply begin looking through those books that you find intriguingjust like viewing source in HTML and CSS, it's an excellent way to become exposed to methods and ideas with which you might be unfamiliar. Be sure to check out the following books by the excellent author, Robin Williams:The Mac Is Not a Typewriter, 2nd Edition (Peachpit Press, 2003), and The PC Is Not a Typewriter (Peachpit Press, 1995). One version of this book focuses on the Macintosh and the other focuses on Windows. They are excellent books that teach the basic principles of type onscreen and print use.The Non-Designer's Type Book (Peachpit Press, 1998). Whether you're already a professional designer or an aspiring one, this book will unveil some surprises about type, how to use it to create great documents, and how to occasionally break the rules.
TipA helpful article detailing this technique and providing additional insight is "Type: the Extra Mile" (www.mezzoblue.com/archives/2004/01/18/type_the_ext).More advanced designers will appreciate a range of books about type. Here are some especially worthwhile ones:Typographic Design: Form and Communication, 3rd Edition by Rob Carter, Ben Day, and Philip Meggs (John Wiley & Sons, 2002). This is a comprehensive history of type, study of letterform, and reference of common typefaces. It's not for the beginner, but it's a great guide for taking basic typography knowledge further.The Elements of Typographic Style, 2nd Edition, by Robert Bringhurst (Hartley & Marks Publishers, 2002). This book provides a comprehensive and advanced look at typography. The encyclopedic depth of knowledge represented and assumed makes it hard to read for anyone but the most advanced typographers, but the practical application of theory makes it a must read anyway.Alphabet: The History, Evolution, and Design of the Letters We Use Today, by Allan Haley (Pub Overstock Unlimited, 1995). Written by a prolific author of typographic books, Alphabet is a fascinating look at the history and design of letterforms in use in contemporary English. Other books by Haley will be worth your while, no matter your skill level.Take a look at very contemporary or controversial works as well, such as The End of Print: The Grafik Design of David Carson, Revised Edition, by Lewis Blackwell and David Carson (Chronicle Books, 2000), for an endless amount of inspiration and argument.
Online Type Resources
If you'd rather surf the Web for type, be sure you've got plenty of time on your hands. The Web is filled with a wide range of type resources, from online type foundries to helpful histories, tutorials, and interviews. Simply doing a Google search for typography, type foundries, and so forth will bring up more options than you can deal with in a day. To get you started, here are a few favorite resources:Type Designers (http://cgm.cs.mcgill.ca/~luc/longdesignersl). This very long, alphabetical list created and maintained by Luc Devroye covers contemporary type designers from A to Z, along with descriptive information about their work, Web-site links, and contact links.Identifont (www.identifont.com). This great site can help you identify a font by answering a series of questions about it. The site offers other typographic resources as well.MyFonts (www.myfonts.com). Perhaps the worst-looking type site on the Web, but it delivers the goods. The search tool is flexible enough to match nonspecific searches like retro and happy, while its WhatTheFont tool attempts to detect the font being used in any image you provide.Adobe Type Library (http://store.adobe.com/type). Adobe maintains a world-class library of fonts for purchase from a wide range of popular foundries.Fonts, Main, from Website Tips (www.websitetips.com/fonts). This is an awesome catalog of everything for Web fonts. It offers shareware and freeware fonts, foreign language fonts, listings for typography organizations and newsgroups, and a range of font-related software.
A proper typographic education is a lifelong process, but that's no reason to be discouraged. The more knowledge you're armed with, the better results you'll experience in your individual works.
Balance Is Key
Aristotle tells us that "moderation in all things" is a wise way to live. While design sometimes should be extreme, for most designers working in the professional world, balance is key.The contrasting typefaces and letterforms of Golden Mean make it clear that finding the right mix of typographic expression helps Web designers achieve that desirable balance pointthe literal golden mean where a design achieves its practical goals while communicating a lasting and refined visual message.
