Typography: A Vital Component in the World of Advertising

“What is typography?” is a question asked by many. Typography is the art of arranging and designing type. The arrangement of type involves the selection of typefaces, point size, line length, line spacing (leading), adjustment of space between groups of letters (tracking) and adjustment of space between pairs of letters (kerning).

Typography has long been a vital part of promotional material and advertising. Designers often use typography to set a theme and mood in an advertisement; for example using bold, large text to convey a particular message to the reader. Type is often used to draw attention to a particular advertisement, combined with efficient use of color, shapes and images. Today, typography in advertising often reflects a company’s brand. Fonts used in advertisements convey different messages to the reader. Classical fonts are for a strong personality, while more modern fonts are for a cleaner, neutral look. Bold fonts are used for making statements and immediately capturing the attention of the reader.

Rules for Effective Typography

You don’t need to spend hours pouring over textbooks to improve your understanding of typography. You’ll be able to use typography more effectively in your design projects if you just keep a few simple tips in mind.

  • Less is more. Keep the number of fonts on your page to a minimum. It’s much better to use two or three different fonts effectively than it is to use seven or eight different fonts to make one confusing jumble of type.
  • Leave enough “white space” on your page. Having some blank space on your page gives the viewer some breathing room. Resist the temptation to fill every inch of your page with text.
  • Use contrast to distinguish between elements. Having one element in bold type or printed at a noticeably larger size is a simple way to communicate its importance on the page.
  • Keep it consistent. Good typography showcases standardized design. In the pages of a brochure or website showcasing imagery from a vacation spot, for example, it’s useful for the viewer to know where to look on each layout to find the descriptive copy and image captions. Consistency also applies to good branding.

Typography and the Web

Typography for the Web has come a long way in the past several years. Not only do we have web browsers that support images, but we also have the opportunity to make our web pages come to life and accurately portray a brand’s image through great typography. Following are some basic guidelines to follow regarding typography and the Web:

  • Contrast. Text exists to be read; make sure that it contrasts enough with the background to achieve that. If you’re ever unsure about contrast, take a screen cap of your page, open up your image editing software and reduce the image to grayscale. You’ll soon see if you have enough contrast.
  • Size. Is your type big enough? Don’t set body text below 10 or 12px and if possible, make it bigger.
  • Hierarchy. Varying type size is one of the best ways to differentiate content. Colors and decorative boxes might help, but different sizes of type used consistently throughout your pages will signal loud and clear to your readers the relative importance of your page’s elements. It also means that if your readers are in a hurry, they can quickly pick out the important bits – and that could mean that they stay longer and read on. Hierarchy can be achieved in many ways – just remember to be consistent. Different styles can be used; for example, all-caps, or italic for sub-headings. Serif and sans serif faces can also be used in combination.
  • Space. Let your type breathe. Don’t be afraid to leave blank spaces in your pages. This negative or white space will help focus attention on the text – and it’s the text that speaks loudest, so let it be heard. Next, remember the line-height CSS property; a good rule of thumb is line spacing that’s at least 140% of your text size. Good type designers put great effort into the micro white space that sits inside type. They spend countless hours achieving a balance between the black of the type and negative (or white) space that it envelops. Likewise, we should take time to consider the macro white space, or the ‘voids’ that shape our blocks of text.

Common Typographical Mistakes and How to Correct Them

Finally, following are several examples of common mistakes and good suggestions on how to make your printed pieces and websites typographically correct:

  • Using All Capital Letters. Use all “CAPITAL” letters in moderation in body copy. They draw too much attention and spoil the look of the column or page. For emphasis, consider italics instead. If you have to set words in capitals, use proper small caps either with or without initial capitals.

  • Connections. There are three different ways to connect or separate words: the hyphen -, the en dash –, a little wider than the hyphen, and the em dash —, wider still. The regular hyphen is easily accessible on any Mac or PC keyboard, whereas the en dash needs the combination option-hyphen on the Mac. The em dash is accessed by pressing option-shift-hyphen on the Mac. The use of these dashes depends on house styles and tradition. The em dash with no space around it is traditionally used to separate thoughts—like this one—but I think its length is a distraction in running text. Try using the en dash to separate thoughts – like this one – with a character space on either side. En dashes without space on either side are also used between numbers and compound words as in: the shop is open 10–7, while you can take the New York–Kansas City train or the New York–Baltimore train at 8am–3pm.

  • Quotes and Apostrophes. A dead giveaway for unprofessional “desktop typography” are wrong quotes and apostrophes. Quotes can have different shapes. They generally look like “this,” and can be remembered as beginning and ending quotes by thinking of “66” and “99.” Beginning quotes are found on the Mac by pressing option-[; closing quotes, option-shift-[. The apostrophe is simply a raised comma, the shape of a ’9 in most typefaces. It is identical to the closing single quote, while the open single quote looks like a ‘6. Beginning single quotes are found on the Mac by pressing option-]; the apostrophe and closing single quote, option-shift-].

  • Justification. If the design allows, avoid justified left and right settings. Most applications create justified text by hideously stretching and squishing words and spaces. Note that it takes many hours of tedious work to typeset justified text that is truly well proportioned and legible. For this reason, professionals prefer to use ragged-right composition, either with or without hyphenation, depending on how much line-length variation they wish to allow. This gives the text a more harmonious appearance and makes it easier to read, since all word spaces have the same width.

Typography plays a very important role in the world of advertising. With the help of these tips and tricks, promotional materials and websites will portray a modern, clean and professional appearance that will indeed make a statement.