Use fonts effectively

Before we start with the fonts options that we have, I  want to talk about page speed and a SEO Tip:

A very important point is the loading speed of your website. The source of your font might delay in some milliseconds your loading speed. Therefore a good tip is to upload your font directly to your website.

We have to do additional steps, like compressing the font file, so I will take over here and will install it on your project.

For this goal, Google fonts are a good option or a custom font that you can buy. Unfortunately, Adobe Fonts does not work because we cannot download the font to compress.


So now, let's take a look at the resources for fonts:


-Google fonts, Google has a typography bank that is open source, that is, free to use.
The advantage of using this font is that the typography remains "as known" every time the browser loads a page. Hence, the next time the browser loads a new page but with "known" typography, the loading time is less. Thus, we can say it already remembers that typography. The disadvantage is, of course, that the typography is the same as in many other pages.

-Adobe Fonts, those of us who have Adobe licenses, have a fonts package that we can use on web pages. The disadvantage is that a designer has to connect the font's API to the client's site, and if the designer gives up the license, the font is disconnected. The page will not go blank, but the font is automatically replaced by a commonly used font such as Arial. The advantage is that the fonts are fresher and not so repetitive (yet) on the pages.

-Fonts from Webflow. Webflow offers 26 default fonts, and because they are already available, they are very easy to use. One of our favorites is Montserrat. The disadvantage is, of course, that you have not so many options.

-Buying a font, there are several places where you can buy great fonts made by artists, and the investment really worth it. (It looks like advertising, but it is not paid) I like the fonts from creativemarket.

As professional designers, we recommend using two different fonts, one for titles and one for text. This topic is very vast, so we can advise which fonts to use according to your brand and concept.

One last thing, the smallest font size for your text should be 16 points.

Cover Photo Credit: Camilo Jimenez in Unsplash

Let´s get in touch

In the Creative Lab, you learn how to make a webpage that drives results for your business. Let´s have a chat to find out, together, how the hybrid model fits your needs!