Dynamic Graphics+Create Magazine
HOME   |   SUBSCRIBE  |   ABOUT  |   CONTACT US  |   NEWSLETTERS  |   CALL FOR ENTRIES  |   ADVERTISE  |   SUBSCRIBER SERVICES  |   WEBCASTS  |   JOBS
Topics
Webcasts
Newsletter
Subscribe/Renew
 
Purchase past issues to complete your library or to find the essential tips and techniques you've been searching for.
 
Tutorials
Create a halftone border in Photoshop.
Add a halftone drop shadow using Photoshop.
Downloads
Free high-quality high resolution photos.
JUPITERIMAGES SEARCH
Jupiterimages offers millions of quality photos, fonts, clipart images and animations!

 
Jupiterimages.com
Clipart.com
Photos.com
Animation Factory
internet.commerce
Join Partner Program
Five Tools of Typographic Emphasis
It may sound strange, but the best way to create typographic emphasis is to exercise restraint. These tools, applied with subtlety, will help your type stand out. 

by Allan Haley
February/March 2006
The central rule of typographic emphasis is simplicity itself: Use discretion. Emphasis depends on exception. The more things are emphasized, the less effective the emphasis. Generally, one level of emphasis is adequate, two levels are substantial, and three are excessive.

Once you’ve got the discretion thing taken care of, there are five basic tools you can use to create typographic emphasis (see right).

1. Italics
The simplest way to create emphasis is to use an italic. Even though italics are generally intended for titles, foreign words, technical terms, and the like, they can also be subtle emphasizers. Using the italic form of a typeface creates a distinct yet harmonious departure in text copy.

While the first italics were not drawn to complement a specific typeface—they were generic designs, intended to be combined with any roman type— virtually all of the typeface families now have italics created just for the family. This means that, although they differ in character design, they share the basic weights and proportions of their roman brethren. Use italics to emphasize words, phrases, or short sentences in text copy. Because their designs are usually cursive (as opposed to simply obliqued or slanted), the italic counterparts of serif typefaces stand out a little more in a block of copy than sans serif italics.

The discretion rule also applies to italics. One or two words in italic stand out without interrupting the reading process. A sentence set in italic begins to be more of a distraction than an emphasis, and a paragraph can be downright difficult to slog through. A little care is also necessary when it comes to italics and punctuation. When an italic word precedes a question mark or exclamation point, an italic ! or ? looks much better than the usual roman equivalent.

Combining serif and sans serif typefaces can accentuate the emphasis offered by the use of italics. In figure A, a sans serif italic in a serif text block creates moderate but definitive emphasis.

If you want to walk on the typographic wild side, however, use an italic from a serif family in a block of sans serif copy. The results will be emphasis with grace, power, and distinction. If you try this typographic trick, be sure that the lowercase x-height of the italics is about the same size as that of the surrounding copy. This may require a point size adjustment (figure B).


Figure A

Figure B

2. Boldface
Emphasizing with bold type is just about as easy as using italics—and you will be making a stronger statement. The first thing to remember when emphasizing in bold is to not necessarily rely on the style bar or formatting palette of your application to access the bold font: Some font families are not set up to switch to a new design when the font format is changed. In such instances, results will be electronically bolded characters with awkward proportions and strange weight shifts. Image at the right shows the difference between proper and improper bolding.

The weight you use to create emphasis should be the result of a conscious decision and not just a click of the mouse. Using the next heavier weight in a family might not be the right choice. In some typeface families, weight changes are subtle. The next weight up from the basic text design may be too light to make a strong statement, and using it will simply distract the reader—instead of highlighting an important point.

3. Size
“Make it bigger” seems like a logical guideline for creating typographic emphasis. While this can be effective, there are also some potential drawbacks to just bumping up the point size.

First, unless you are setting copy with generous line spacing, the bigger type will appear cramped between the lines of type above and below it. If you make the size enlargement subtle, there will be less chance of the copy appearing cramped— but if the size increase is not obvious, the opportunity for emphasis is lost.

If you are emphasizing by increasing the point size of the important information, it’s best to separate the word, phrase, or sentence from the rest of the copy. Try centering it in the text column, like a pull-quote (figure A), or run it as its own copy block, keeping the column width consistent with the text around it. If you are emphasizing a phrase or sentence, the word spacing may also have to be adjusted to be optically consistent with the smaller copy. And, if you are setting the copy justified, you will probably have to deal with word spacing that is too open and hyphens that litter the right edge (figure B).


Figure A

Figure B

4. Color
Color is an excellent—if sometimes expensive— emphasizer. Color is irresistible … unless there’s too much of it. It is color’s rarity that makes it noticeable and a powerful differentiator. The less color you use, the more valuable it becomes.

A couple of tips for emphasizing with color:
  • Set colored type in bold, to compensate for color’s paleness relative to black.
  • Work out your document’s color scheme before you begin the page layout. Color should be designed, not added as an afterthought.
  • Don’t waste color on headlines for the sake of emphasis. Headlines already stand out by virtue of their size and boldness. Color only decorates them and mostly represents waste. You may, of course, have other, valid reasons for using color in your headlines.
5. Typestyle change
A change in typeface will also create emphasis. There is a typographic “Golden Rule” of sorts for combining fonts from unrelated families: The greater the difference in type designs, the better the mix—and the more powerful the emphasis. Visually, strong contrasts typically don’t create problems, but when typefaces from different families that look a lot alike are combined the result is visual discordance rather than emphasis.

The least risky combination is using a sans serif typeface for emphasis in copy set in a serif design. If you want to combine two serif designs, pair very different typefaces. Using a sans serif design as an emphasizer in copy set with a different sans serif face almost never works.

Coda: The nevers of emphasis
Most typographic rules leave a lot of room for “artistic” interpretation. There are a few associated with creating emphasis, however, that are right up there with not eating crackers in bed.

  • Never underline.
  • Never reverse text type out of a dark block.
    More than five words in reverse becomes tedious and difficult to read.
  • Never emulate a “highlighter” by putting a yellow tint over copy.
  • Never use bold italic—well, almost never. There may be cases in your stylebook where it’s called for (as in DG’s!). But most of the time, if you want to be subtle, use italic. If you want to make a strong statement, use bold. Bold italics suffer from dissociative identity disorder.
  • Never set all caps for emphasis in text copy. In fact, never set all caps for almost any reason. If you need to use all caps in text, use small caps.

All methods of typographic emphasis are seductive; some are downright fun. The best uses of them, however, are restrained rather than effusive.

SIDEBAR:
White, Black, Red - The Best Typographic Colors

To be absolutely safe in the use of color, use the three most powerful:

  • White—that’s your background
  • Black—always the best for type
  • Red—the proven winner for emphasis and drama
In print, white is the absence of all color; on screen, it is every color at full strength. White is the brightest color and the perfect backdrop for any other color placed on top of it. Every other color stands out from, and contrasts with, white.

Black holds the highest contrast to white. It is the best, most logical choice for type set on a white background. Type can be set in other colors, but every step away from black is a step away from the perfect contrast and the best shot at readability and comprehension. Gutenberg, Garamond, Caslon, Bodoni, and Baskerville could all have chosen to set their text in a color other than black—but didn’t. Hundreds of years later, we revere their work as some of the best typography ever produced.

And then there is red. Yellow on white is difficult to read. Red on white isn’t. Blue type fades against a black background. Red won’t. If you are considering a third color for typographic communication, think of red first. The third most powerful color for type, it is so powerful that it shouldn’t be used to replace black. A lot of red type can easily become overpowering.

About the author
Allan Haley is director of Words & Letters for the International Typeface Corporation.
Events & Courses


JupiterOnlineMedia

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info


Legal Notices, Licensing, Reprints, & Permissions, Privacy Policy.

Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

Solutions
Whitepapers and eBooks
IBM Whitepaper: Innovative Collaboration to Advance Your Business
Internet.com eBook: Real Life Rails
Avaya Article: Call Control XML - Powerful, Standards-Based Call Control
Tripwire Whitepaper: Seven Practical Steps to Mitigate Virtualization Security Risks
Internet.com eBook: The Pros and Cons of Outsourcing
Go Parallel Article: Scalable Parallelism with Intel(R) Threading Building Blocks
Internet.com eBook: Best Practices for Developing a Web Site
IBM CXO Whitepaper: The 2008 Global CEO Study "The Enterprise of the Future"
Avaya Article: Call Control XML in Action - A CCXML Auto Attendant
Go Parallel Article: James Reinders on the Intel Parallel Studio Beta Program
IBM CXO Whitepaper: Unlocking the DNA of the Adaptable Workforce--The Global Human Capital Study 2008
Adobe Acrobat Connect Pro: Web Conferencing and eLearning Whitepapers
Go Parallel Article: Getting Started with TBB on Windows
HP eBook: Storage Networking , Part 1
MORE WHITEPAPERS, EBOOKS, AND ARTICLES
Webcasts
Go Parallel Video: Intel(R) Threading Building Blocks: A New Method for Threading in C++
HP Video: Is Your Data Center Ready for a Real World Disaster?
Microsoft Partner Portal Video: Microsoft Gold Certified Partners Build Successful Practices
HP On Demand Webcast: Virtualization in Action
Go Parallel Video: Performance and Threading Tools for Game Developers
Rackspace Hosting Center: Customer Videos
Intel vPro Developer Virtual Bootcamp
HP Disaster-Proof Solutions eSeminar
HP On Demand Webcast: Discover the Benefits of Virtualization
MORE WEBCASTS, PODCASTS, AND VIDEOS
Downloads and eKits
Microsoft Download: Silverlight 2 Software Development Kit Beta 2
30-Day Trial: SPAMfighter Exchange Module
Red Gate Download: SQL Toolbelt
Iron Speed Designer Application Generator
Microsoft Download: Silverlight 2 Beta 2 Runtime
MORE DOWNLOADS, EKITS, AND FREE TRIALS
Tutorials and Demos
IBM IT Innovation Article: Green Servers Provide a Competitive Advantage
Microsoft Article: Expression Web 2 for PHP Developers--Simplify Your PHP Applications
Featured Algorithm: Intel Threading Building Blocks - parallel_reduce
MORE TUTORIALS, DEMOS AND STEP-BY-STEP GUIDES