Typography matters as much as geography. Businesses take a great deal of time to consider the implications and pitfalls of entering a new market, but they often leave major components of their UX to the arbitrary decisions of outside contractors. Everything matters in brand identity, especially the look and feel of the fonts that identify your company.
Font vs. Typeface vs. Typography
First of all, let’s define some technical terms that are too often used interchangeably:
Font — specific designs of letters, numbers and symbols. For example, Linux Biolinium broke out as the standout semi-serif font for mobile web design in 2013.
Typeface — the theoretical underpinning of a font, defining it’s intended impact. For example, Helvetica can be a serious typeface, while Comic Sans is the absolutely the wrong typeface for announcing dramatic discoveries in physics. Yes, people are still upset about that.
Typography — the visual arrangement of letters on a printed page or web page, including considerations such as color, size, kerning (spacing), line length and integration with surrounding images. For example, the font may be beautiful and the typeface might support the brand message, but the typography can still be painful to look at.
Matching brand to typeface
It should be clear that before you send your web page off to the creative team, you need to clearly understand what you want your brand to signify. What kind of person relies on your brand? What do they say when they choose you over the competition? How will people feel after they purchase items from you? It may sound like a bit much to think about when you are staring down a column of 1000 fonts, but the time investment now will certainly payoff in customer loyalty.
Armed with the emotional content of your brand’s message, you can specify a typeface, even suggests some specific fonts for your design team. Make sure that the fonts and images that designers choose are fully complementing each other before you move on to the typography phase.
3 Typography Rules for Site Owners
Graphic designers will have to take over after your approve the typeface, but there are several things you can do to prepare for their first mock-ups.
- Get the hierarchy right — What do you need to communicate first and foremost? Make sure the typography highlights that section first and is easily readable. Background messages are effective in rotated or translucent text. Even if the site visitor does not register these message consciously, their brains will be able to understand the information and file it away.
- Understand the emotions of color theory — Different people and cultures experience colors differently. You can’t say what a single individual will feel about a color, but color theory is remarkably accurate for site visitors as an aggregate.
- Think mobile — The majority of people on the web now are logging on via mobile device rather than a desktop or laptop. This is about much more than centering and designing the UI for a fat. This is why apps are overtaking mobile web as well — apps provide absolute control of the UX across platforms.
The typographical design of the best web pages can lead visitors along like a guide in the wilderness, introducing them to all the amazing and amusing content on your site. Of course, you want the sales page to be the visitor’s ultimate destination, but you must provide them with evidence of your value first or you bounce rates will become unsustainable.
Best Typography Awards
When you are ready to see what a difference great typography makes, drop by the Awwwards for the the world’s best examples of typography in web design for 2014. The fact that so many of them are in another language will help English speakers focus more on the UI of these sites rather than just on the semantic content of the words.
The typography of a site should feel as original and instantly recognizable as the company logo. Take a look at your own site with new eyes and see if you can tell what it is trying to say.
Download these worksheets and start practicing with simple instructions and tracing exercises.
Download now!
I'm a recent graduate of the University of San Francisco with a degree in Biology and a passion for the creative arts. I love building websites, trying new things, and I have a passion for social media.
View More Posts
