Expert Tips and Tricks on How to Pick a Website Font

Expert Tips and Tricks on How to Pick a Website Font

How’s this for a shocking stat: 75% of people say they judge a company’s credibility solely based on the design of their website. 

If humans judge a book by its cover, then they certainly judge a website by its colors, images, and yes, even its fonts. 

This means that every decision you make when designing a new website needs to be considered carefully. And, your website font is perhaps the most important decision you make. 

After all, if the text on your site is hard to read, how can you expect customers to convert? 

If you’re wondering how to choose good fonts for websites, have no fear. Read through this handy guide for the best tips and tricks on all things web fonts. 

Understanding Font Basics

Before you can make the choice on which fonts you want to use on your website, it’s important to have at least a broad understanding of font basics. Specifically, you should know the different types and aspects of fonts. 

Serif

Serif fonts are distinguished by the fact that the letters include a small stroke or line attached to the ends of the letter. When you think about the text from an old typewriter, that’s a serif font. 

One of the most recognizable serif fonts today is Times New Roman. 

Sans Serif

Sans serif fonts, on the other hand, do not include the small lines (or serifs) on the ends of the letters. Many times, the body text on a website is sans serif. 

You might recognize Arial as a popular sans serif font option. 

Script

Script fonts tend to look like cursive handwriting. They sometimes include extra flourishes and are a great option for headers, as they are generally too hard to read as a body text. 

Kerning

Have you ever noticed that the letters in some fonts are very close together while others are spaced further apart? That space between letters is called kerning. 

Kerning is a subtle aspect, but you might be surprised by how much it impacts the overall look of a font.

Get Inspiration

Now that you know more about the different types and aspects of fonts, you can start getting inspiration from other websites. 

Visit some of your favorite sites. What types of fonts are you drawn to? Do you like big and bold serif headers or do you like the feminine touch of a script font? Or, maybe you love the look of a serif and sans serif font used together?

Start making some notes about the general styles you like. You don’t necessarily need to know the names of the fonts you like during this stage; it’s more about just finding what you like. 

Consider Your Brand

After gathering inspiration, it’s time to consider your brand. While a website font might seem like a small decision in the big scheme of things, the truth is that it reflects your brand. 

What kinds of products do you sell? Is your tone very professional or more casual? How do you want your company to be perceived?

The answers to all of those questions should influence your decision. If you’re a law firm, for example, you want to choose something professional, otherwise, you run the risk of potential customers not taking you seriously. 

On the other hand, if you run a fun baking company, choosing a font that looks too “corporate” could also send the wrong idea. 

Once you have a good idea of the styles you like, and the tone you want to convey, you can start searching for specific fonts.

Use a site like https://setapp.com/apps/typeface to compare different fonts based on your preferences. 

Mixing Fonts

Have you found a few different fonts that you like? That’s a good thing! If you only use the same font throughout your whole site, it can look dull. And, it can be harder to make certain text stand out. 

However, you want to make sure you don’t go overboard using a dozen different fonts either. A good rule of thumb is to stick to no more than 3 different fonts: a primary, secondary, and accent font. 

Your primary font should be the “default” font on your website, used for body text, and the bulk of the information you want to share. It should be very easy to read, no matter where it’s used on your site. 

You’ll use your secondary font for headers throughout your site, to grab a visitor’s attention. Think of it as your hook. 

Finally, your accent font is perfect for sporadic use throughout your site, such as button text and on other calls-to-action. 

Size Matters

Once you think you’ve narrowed down your primary, secondary, and accent fonts, test them out by viewing them in different sizes. What looks great in a 14 pt font might look overwhelming when used in a larger header. 

Don’t forget to test to see what all of your fonts look like when bolded as well. 

It’s normal to go back to the drawing board to pick new fonts after doing some testing, but it’s worth it to make sure you’re making the right choice for all scenarios. 

Compatibility Is Key

Finally, you don’t want to choose the perfect font, only to realize that it isn’t compatible with certain web browsers.

In that case, the browser would show to a different, compatible font to your website visitors, rendering all your hard work in making a decision pointless. 

Before you launch your site with your new fonts, make sure to test across multiple browsers for compatibility. 

Fortunately, Google Fonts are specifically designed for the web and are compatible with almost all browsers. If you choose one of their popular font options, like Montserrat or Roboto, you shouldn’t have to worry about compatibility issues. 

Choosing the Right Website Font Makes All the Difference

Now that you know the best tips and tricks for choosing a website font, you can make your decision with confidence. And, you won’t have to worry about losing out on potential customers due to your design choices. 

For more helpful information like this, check out our other blog articles.