Font determines the tone of the test and reflects its influence on whole website design. It evokes a sense of time, place and emotion. Make sure you choose the right one
The primary duty of typography is to convey information in writing. To paraphrase Emil Ruder, the great Swiss typographer, a website which cannot be read or understood becomes a product without purpose. However typography does not just convey information. It also imparts feeling, emotion and sentiment, as well as arouse preconceived ideas of content, tone, trust and suitability.
As a designer, the way that you set your type – for example when you are tweaking the size, spacing, colour and context – will go a long way to forming a negative or positive experience. The quality of your typesetting can have a big impact on how your reader feels when they see your creation, but the most significant contributor of all will be your choice of typeface.
Headings and Display text always grabs the attention of Users. They set the scene and draw people in
When considering a typeface for your website body copy, that is to say the bulk of the text to be read, your decision will largely be driven by practical considerations. The type you choose for body text should remove as much friction as possible between your reader and the text. The last thing a reader wants is to spend time with a typeface that keeps trying to grab their attention – that would just get tiresome and irritating after a while.
When you’ll have your initial choice between a sans and a serif then you’ll be looking for similar traits in a typeface; it could be sturdy and simple shapes, with a low contrast between the thick and thin strokes as well as generous x-height. The upshot of making all of these practical decisions is that the different choices of body text that you make will not provide big differences in your reader’s mood, although they will still register in a subtle way.
Think about the kinds of message the text should be conveying. Do you want the site to be more child-like or more professional and business-looking?
If you do want to have a big effect on your reader, the opportunity is still there: headings and display text are your attention grabbers. They set the scene and draw people in. Visitors to the webpage will ‘see’ this type before they ‘read’ it, and that’s your chance to choose a typeface that immediately expresses what the text, and indeed the entire website, stands for.
Think about the kinds of message the text should be conveying. Do you want the site to be more child-like or more professional and business-looking? Your typeface will impart an emotion to the reader. You might want them to feel excited, comforted, reassured or even tense. Consider typefaces with these emotions in mind. All of us associate certain letterforms with topics, places and times, so identifying typefaces that have a relationship to your content or client can give a sense of place, evoke a mood or even reference a specific period in history. Above all, experiment. Once you’ve found a good direction, make sure to try variations alongside your body copy to fine-tune your choice.
Classic combination of expressive display font and hard-working geometric sans for the navigation and body copy, lending a high-quality feel.
What kind of message should your text convey?
The font choice can set the tone of the text. Consider what is appropriate for what you want to do. For example, do you want a child-like enthusiasm? Formal business-like tone? Cutting-edge tech style? A hipster and craft feel? Futuristic design? Retro look? A sensible and secure study? A fun and informal composition? Or an authoritarian and trustworthy concept?
How do you want your reader to feel?
Your typeface will impart all kinds of different emotion to the reader. You might want them to feel excited, comforted, reassured, surprised, respectful, intrigued or even tense. Think carefully about the feeling that you want to convey.
What time or place do you want to invoke?
All typefaces come with the baggage of history. If the text is pertinent to a particular point in time such as the Twenties or something a bit more futuristic, or hints at a distant location such as Mexico or Scotland, your font could hint at this.
What features do you need the font to have?
Many fonts come packed with OpenType features such as swashes, ligatures and alternative characters. These features can enhance your design so whittle down your shortlist accordingly.
How much does it cost and is it available as a web font for your project?
Some fonts are free and some are expensive. Do you have a budget? Not all fonts are available as web fonts yet, and some only through a service, which can be a limiting factor.