WTF!? (What tha font)
This is a piece from the 10 guidelines for Kickass World Class website making.
If you say 3 things, you don’t say anything.
Filip Nordin showed us how to do it in a high-contrasting, neutral, non bullshitting way.
This topic is, by far, the most difficult one for me to talk about. First of all, typography is probably the most academic component in Website making. And i realised i do not have the proper knowledge or training to write as an expert. Second, because most of the references we find about typography are technical, focused on the basics, the rules and the structural thinking.
Am i not interested in those topics here, not today.
I am going to leave the Design principles and typography rules aside and assume you guys have them already tackled. That way we can focus on the aspects i consider as tie breaking — the ones i see being the difference between world-class-website-making and average-overruled-Design.
Typography is a very important Design element. So make it either multi-dimensional or multi-directional — give it a real feel of weight and depth.
Look at this great example from FS Millbank. It is coincidently a website made for this typeface presentation, but it could have been anything else and still have a good execution. Anyway, the principles to keep in mind here are the steps led by rhythm, sense of space and weight. All conquered by good transitions and multi-directional layouts.
Work and balance your compositions.
Top level Designers can be spotted easily, mostly because of that. Here’s the thing: Great designers, they know the “rules and regulations” of typography and they can bring balance out of chaos. Usually, the layouts feel clean and light. But today, that’s not enough for excellence. You gonna have to create rhythm and real world feeling, animate your typography and let it be part of the content too — not just a merely informational element.
Bryan James got my attention with this amazing project from Nurture Digital — for many reasons — and one of them was the typography treatment. Despite the smooth transitions and visual hierarchy, this website has included type as part of the navigation by masking and unveiling content.
When you put typography in this pivotal position, you enable the concept to become even more cohesive and interesting from a Design point of view.
For instance, Bolden studio was able to explore a technical challenge with a solid concept and resolution using blending modes — multiply effect — on a multi-layered typography treatment. This interesting approach allowed the text to be the center of attention and then replicate it (over images) through the whole website.
As you can see, these are the treatments i consider when assuming typography as one of the main ingredients for World-Class website making. I am not talking about font-pairing, or line height rations, or readability factors, or any of those dramatic equations.
I am talking about having fun after knowing all those rules
Let me know what your thoughts are about this topic. I could use some extra knowledge to improve my typography skills too.
(read the other posts on 10 guidelines for Kickass World Class website making)
