Luxury Design for Digital Marketing: Typography
It’s a challenge for any organization to produce digital media that convincingly signals “luxury”. Brands who manage to accomplish this feat often follow a similar set of aesthetic guidelines.
Take the examples of Burberry, MATTE Projects, and Edition Hotels. These three companies differ in scale and operate in unrelated industries. Yet their digital media bears the signature of a similar aesthetic — one that manages to communicate that what they sell is prized and expensive.
Three Brands, One Digital Aesthetic
In this series of posts, we’ll take a look at five specific elements of design — layout, typography, artwork, transitions, and web forms — in order to come up with a set of best practices to help your company produce beautiful digital marketing assets that are suited for the luxury arena. We’ll start by exploring the art of typography.
Typeface and Feelings of Luxury
Typography is the practice of arranging type to make what we read both legible and appealing. The right typeface decisions positively influence consumer perception of product value, and poor typographic choices lead to a loss of pricing power. If you manage the digital marketing assets of a luxury brand, you can use the following typographic guidelines to give those assets a luxe look.
1. Font Selection and Styling
Be discriminating — the vast majority of typeface options are actually poorly suited for luxury marketing campaigns. Leading luxury corporations, such as Chanel, often feature proprietary typefaces in their marketing, so your design team might consider creating or purchasing a signature font to represent your brand. A short list of public-domain fonts and stylings that work well within a luxury context include:
- Didot (Any Treatment: No Decoration, Italic, Uppercase, Lowercase) — for headers
- Avenir Black Wide Spacing — for logos
- Gill Sans Bold Wide-Spacing — for centered lists
- Georgia Uppercase Bold, Wide-Spacing — for captions
- Avenir — for article text
Pro tip: Note that style settings like uppercase and wide letter-spacing often make typeface appear more luxurious.
2. Mono or Binary Palette
Stick to one or two colors. Variation in color often spoils the perception of luxury. If you’re working with a white background — a design standard for luxury brands — venturing outside of a binary palette of black and grey for your typeface is a risky move. A similar color rule applies if the background of your interface is black. In that case, stick to white text, and if the situation calls for a second color, limit the choice to grey.
3. Element Distinction
Differentiate the design elements of your layout with distinct typeface choices. Menu text, subject headers, image captions, table headers, generic body text — these all represent unique design components and each deserve a unique appearance. Layouts with undifferentiated design elements tend to fail as luxury interfaces because they’re boring.
4. Variation and Harmony
Experiment with a broad range of fonts — serifs and sans serifs, different spacings and and font weights — in order to develop a style mix that balances variety with harmony. Keep in mind that typeface embellishments that are appropriate for headers are rarely suitable for the generic text within the body of paragraphs, or within headers and footers.
5. AB Alternation in Captions
Use an AB alternation structure for typeface in image captions. Often the greater the variation between typefaces A and B, the more luxurious the caption will appear. The example above is composed of (A) Georgia Bold Uppercase and (B) Didot Italic Lower Case. Some typical AB alternation patterns include:
- (A) Serif Bold Uppercase and (B) Sans Serif Italic Normal Weight
- (A) Serif Bold Uppercase and (B) Sans Serif Normal Weight
- (A) Sans Serif Bold (B) Sans Serif Normal Weight
6. Variation Constraints
For a classic interface consisting of a header, body and footer, the optimal number different typefaces is usually between 6 and 10. So you’ll want to guard against layout structures that contain bodies with too much complexity. Matching unique font choices to a complex body layout often results in too much typeface variation. And excessive variation has a tendency to diminish the aesthetic integrity of the interface.
7. Minimal Verbiage on Intro Pages
Keep the text on Page One interfaces to minimum. As a general style rule, don’t exceed a two line maximum for your sub-captions and teaser text. And keep wording as concise as possible. Save your lengthier text for articles and product information pages.
8. Subtle jQuery Animations
Apply at least one tasteful jQuery animation to a key text element. Edition Hotels repositions its logo. Burberry applies a subtle style toggle to the words ‘shop now’. The menu in the desktop version of MATTE Project’s homepage features a slick reveal slide. Sellers of luxury goods that are serious about producing media with similar high-end touches should add an expert front end developer with jQuery competence to their team.
9. Left Alignment with Multiple Columns
This is a simple rule, but always left-align lists of text when faced with a layout comprised of multiple columns. Only center-align text when it’s contained within a single column section that extends the full width of the screen.
10. Avoid Basic Underline
Remove underlines. While the underline is the default text treatment for hyperlinks, the style attribute produces a cluttering effect that reduces readability. Your best move is to avoid using this style choice when building a luxury interface.
11. Subtle Icons
Replace words with icons where you can, especially in the nav bar. Icons should be subtle — so make sure to keep their dimensions small and choose an icon pack that reflects a minimalist aesthetic.
12. Uppercase Nav Menu Text
Keep menu text in your nav bar uppercase. This suggestion is especially relevant to desktop designs. While it may not have been the case five years ago, the uppercase attribute seems have become the style standard for nav bars of leading-edge luxury interfaces.
