When it comes to design, effective typography has become a necessity—not only because the text reflects your content, but also because it adds to the look and feel of what your users consume, while also dictating how they consume it. In the context of user experience (UX), good typography has everything to do with how long a user is willing to interact with your service or webpage plus their attitude towards it.
Related: 10 best branding & corporate identity design examples
The subject of typography is broad, involving many different techniques and methods, but that doesn’t change the fact that it should be treated like a priority. Luckily, even knowing a little bit about typography can drastically improve UX, which makes it an investment with immediate pay-off.
The purpose of typography
Think about your favorite brands. What do they have in common? Strong brands consistently work with a selected font style that appears in everything they produce (a result of having great brand guidelines). Typography helps brands build a personality, stand out and be memorable. [
]
Take the Nike logo, for example: the bold block text, combined with the slant to the right, gives the impression of strength and movement—making it perfect for a sports apparel company. Imagine how much the impact would be lessened if it used light, lowercase letters.
It’s best to think of typography as a handshake: it’s the first impression you make, which makes it even more important if you’re running a website for a small business or brand.
Before users read through your text, they visually register it first. Is the text too small or too large? Are the lines too close or too far from each other? Do your color choices impact readability? Is everything written in big unwelcoming blocks?
The bottom line is that it must be easy to read, or users will choose not to read it at all. For web designers, creating a successful and comfortable UX means choosing the appropriate typography for your content.
Give users what they want
When trying to create a positive UX, it’s important to understand how users think. Through different studies and surveys it was found that, on the average webpage, users will only read 50% of the context and move on—and a lot of them don’t even scroll down. According to information gathered by Conversionxl.com, post length doesn’t always matter… but how pleasing it is to the eye does.
The Gestalt Principle of Perception states that we have a tendency to organize visual elements depending on things like similarity, closure and proximity, and these things carry over to our reading behaviors. You can work this to your advantage by creating a clear hierarchy and using bigger fonts (called headers and subheaders) to separate portions of text. You should also keep in mind that emphasis (such as italics, bold and underline) should be used sparingly to retain its effect.
Delivering the right message the right way
Beyond visual appeal and impact, good typography can be used to your advantage. Often, new brands and websites can earn positive reactions from users by providing attractive, easy-to-read text. The reason for this is both simple and logical: it’s a sign of credibility and expertise, which users then associate with the brand presenting the message.
There are a few basic rules to sending a clear message via typography. The first is to keep it simple by using as few font styles as possible. Most webpages and designs only need two font faces; using more runs the risk of looking too cluttered or busy. It is also worth noting that, despite the thousands of free fonts found on the Internet, many websites pay for fonts with proper kerning, spacing and style variations. This makes it easier to use the same font face to evoke different feelings and reactions.
Typography is a lot like a picture: it speaks for itself. The color of your text will clue in users to what they can expect (like how red can be alarming but blue can be calming). Font faces tell users how to approach the text. Think about why script fonts are popular for party invitations, or how fonts that look handwritten feel more personal.
Improving readability and legibility
Since effective typography goes hand-in-hand with great UX, you should also know how to keep users’ interest in your message all the way through. That’s where readability and legibility come in. To keep your text visually pleasing and functional at the same time, here are a few basic guidelines.
- Don’t use small font sizes. Books use small font sizes because you hold them close to your face. Because computer screens are farther from our eyes, we need bigger text to compensate for the distance.
- Instead of using more fonts, you can use the fonts that you are already using in different weights, sizes or styles for creative contrasts.
- Make sure that the color of the text and the background are high-contrast. Just like font faces, colored text should be kept to a minimum.
- Set the text spacing to 1.5 to let it breathe. This helps users read faster and understand the text better.
- For blocks of text, use serif fonts (like Times New Roman, Georgia or Garamond) and sans serif fonts (like Arial or Helvetica) for titles and headers.
- Strategically plan the arrangement of your text by using alignment and hierarchy to keep your webpage clean and organized—and users glued to what’s important.
Typography tools and further learning
Today, typography can be a casual hobby for some and a full-blown art for others. Wherever you place yourself on the spectrum, there are easy ways to learn more. For instance, there are many tools that can help you apply what you know to ease UX on your website.
Once you’re more comfortable with your knowledge, it’s time to experiment and have fun with it. Websites like @font-face, Adobe Typekit and Typotheque can help you get started, but don’t be afraid to do some exploring.
Integrating typography into UX is more than just using presentable text. It’s often the difference between comfort and disinterest in your users—and the thin line between failed and successful conversion in your marketing.
