ICT Button with Arrow Green Leaf Toucan Extended

We help businesses stand out, so they significantly increase their chance of converting more leads

+ 0 %
Increase in conversion off a high base - Manufacturer
0 %
Increase on conversion rate - B2B Service Business
+ 0 %
Increase on leads with a simple 1 page UX/UI revamp - B2B
+ 0
Awards & mentions across 4 different industries since 2009

Need a strategy?
Let’s point you in theย right direction

Required fields

Call us curious cats...

Blog

09 Sep 24

6 Best Practices in Website Typography You Need to Know for Better User Experience

Alice Khau | Web Design

Typography is one of the critical components of good website design. This is not only for the additional visual impact but also for establishing a connection between the user and the website.

Unknown to many, typography can actually affect users’ perception of the site. Using a bad combination can distract users and cause them to move to another website. But if you use good typography, you are now making your website more accessible for reading.ย 

So how can you create a website with better typography? While there are many ways to do it, you only need to follow six practices to improve the typography of your website.

 

1) Use a Limited Number of Fonts

Too many fonts? Itโ€™s like throwing a party where everyoneโ€™s shouting at once. Your website needs structure, and too many font styles just mess with that.

Stick to one or two fonts max. One for headings, one for body text. Thatโ€™s it.

Why? Because consistent fonts help your visitors know where to focus, plus it boosts your brand recognition โ€” by as much as 80%, according to Linearity.

Good combos are fonts that either come from the same family or contrast well. Some pairs I like:

  • Montserrat and Roboto
  • Playfair Display and Open Sans
  • Lora and Nunito
  • Oswald and Merriweather

 

2) Maintain Adequate Line Spacing

Typefaces also need a space to breathe. It is a general rule of thumb that you should give enough line spacing or leading between texts to improve their readability.ย 

A good leading is recommended to be at least 30% more than the actual character height. This small space adjustment can make a significant difference in making your website content easier to read and digest.

 

3) Steer Clear of All-Caps Text

Using all caps in certain parts of your website design is fine, especially if it is an acronym or logo. However, it is different when we talk about sentences or paragraphs.ย ย 

This is not only because it seems like you are shouting at the user. All caps are a big no-no as it makes text much more difficult to read and scan, which slows down comprehension.

 

4) Opt for Standard Fonts

Sometimes, simple is better.ย ย 

Just to be clear, we don’t have anything against using unique font styles. A lot of website users actually find them interesting and novel. However, the only issue with these fonts is that they can take away the readerโ€™s attention from the information that matters.ย 

So instead of paying attention to your product or service, thereโ€™s a higher chance that they pay more attention to the font you used. That is why, we highly recommend sticking to classic fonts to draw and keep the reader’s attention on the content itself.

Below are some classic fonts you can use:

  • Georgia
  • Arial
  • Verdana
  • Helvetica
  • Garamond

Read “Tips for Choosing the Best Web Fonts for Your Websites” for a more detailed guide on the right fonts to use.

 

5) Select a Typeface That Remains Clear at Different Sizes

Not everyoneโ€™s on a desktop with a huge monitor. Actually, over 90% of people are browsing on mobile these days.

Your typeface needs to stay clear and legible whether itโ€™s on a tiny phone or a giant screen. Test your fonts at different sizes and tweak as needed so nobody has to squint.

 

6) Use the Right Amount of Characters Per Line

Ever try reading a sentence that stretches across the whole screen? Itโ€™s tiring.

Aim for about 70 characters per line on desktop, and around 30โ€“40 on mobile. It might feel short, but this makes it easier for eyes to jump from one line to the next without losing their place.

Donโ€™t feel you have to fill every inch of space โ€” white space helps your text breathe and your readers stay engaged.

 

Create a Website with the Best Typography

Creating a website with good typography is all about creating balance in every component. This means that you donโ€™t want too much or too little of it. Instead, you want it to be just the right amount to give your readers the best experience they can only find on your website.

Canโ€™t choose the right typography for your website? Our team at Chromatix is here to guide and assist you.ย 

Here at Chromatix, we specialise in developing websites that not only look great and professional but also enhance readability and user experience through effective typography. Give us a call on 03 9912 6403 to take your site’s typography to the next level

Google Review Image