1

I have recently become aware of a fundamental mistake I had been making; I have been matching a company's identity's typeface and using it for the headers of my websites, which in hindsight really detracts from the overall feel and merges their brand in with the rest of the site.

I have now had to start thinking about the shock-horror of having the company's 1/2 brand typefaces and selecting 1/2 typefaces for website headings/body to synchronise with them.

Any tips/advise that could be shared about doing this, when there are 3-4 typefaces to be combined?

Is it a case of just varying the weight and style of 1 particular font that works well with the ID?

3
  • 3
    Are you building an internal-only "web portal" site, or an external, customer-facing "products and services" site? Jan 6, 2013 at 22:40
  • A corporate ID standards document usually includes both the specifications for logos as well as typography standards. There's no hard-and-fast rules about this.
    – DA01
    Jan 7, 2013 at 18:32
  • This is a hypothetical question but I am talking about general usage of fonts. Don't really understand why internal / external makes a difference. And brand usage guidelines aren't the reason for the choice they are the result.
    – johncarter
    Jan 8, 2013 at 10:38

1 Answer 1

3

Every website has different requirements, regarding aesthetics as well as legibility.

However, an article that you might find interesting and you could use as reference (I do) is Smashing's “What Font Should I Use?”: Five Principles for Choosing and Using Typefaces.

These guys established 5 fonts categories or groups: Geometric sans, Humanist sans, Old Style, Transitional/Modern and Slab serifs; and then created a sort of rule on how to combine them. Adding a very short version here:


This is a general principle of design, and its official name is correspondence and contrast.

When we combine multiple typefaces on a design, we want them to coexist comfortably — we don’t want to distract the viewer with the question, are these the same or not? We can start by avoiding two different faces from within one of the five categories that we listed above all together — two geometric sans, say Franklin and Helvetica. While not exactly alike, these two are also not sufficiently different and therefore put our layout in that dreaded neither-here-nor-there place:

enter image description here

If we are going to throw another font into the pot along with Helvetica, much better if we use something like Bembo, a classic Old Style face. Centuries apart in age and light years apart in terms of inspiration, Helvetica and Bembo have enough contrast to comfortably share a page:

enter image description here

enter image description here

But if we want some principle to guide our selection, it should be this: often, two typefaces work well together if they have one thing in common but are otherwise greatly different. This shared common aspect can be visual (similar x-height or stroke weight) or it can be chronological. Typefaces from the same period of time have a greater likelihood of working well together… and if they are by the same designer, all the better.

Some other links:

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.