Consistency matters in marketing. Offering a seamless experience helps reinforce brand values and to reassure clients.
Hence the capability to provide custom, brand-specific, fonts on sites is hugely valuable. The problem is that not everyone recognises the cost. Custom fonts make websites slower. And sites frustrate visitors.
The influence on the bottom line is quantifiable and real, with a growing list of case studies demonstrating a link between a site’s speed and KPIs such as conversion as well as search engine rank.
Why do custom fonts create sites slow?
The issue is simple: visitors are not likely to have your customized font stored on their device. They have to load it. And that takes time.
What’s more, font files are referenced in design sheets, meaning that before they can start to load the ribbon, a visitor’s browser must download the style sheet. All this will delay the point at which text is displayed.
Different browsers behave in various ways, but you come across sites where images and graphics appear and you need to wait for the text to be dropped in.
When it’s a very long delay, it doesn’t make for a fantastic consumer experience, and people will simply go elsewhere.
What could be achieved?
The very first thing to do is try to assess the impact. Find out how much your website are slowing down and work out exactly what that means to your business. User tracking solutions that monitor the relationship between site speed and conversions are creating this sort of analysis simpler.
There are also some practical Actions you can take to minimise the performance cost of fonts:
1) Cut them out
Should you really care about speed, then you can prevent branded fonts completely. There’s always a performance cost, and the only way is to adhere to conventional, internet fonts.
This is seldom an option. Fonts are popular for good reason, although nobody needs a website that is slow.
1 compromise is to avoid customized fonts. The impact on page speed will normally be higher on cellular, partly because of slower, less reliable web connections and partially because the devices themselves will have a tendency to be less capable.
Two) Preloading
One of the methods of getting fonts to load is to use something called preloading. You can tell the browser that it is going to want the ribbon. It can get on with loading it. Support for preloading is not universal, but it’s a great way to get fonts avoid customer frustration and to load.
3) Subsetting
Subsetting is of loading just the figures a method. A font file will therefore be smaller. And a more compact file will load quicker.
For instance, you may not have to load characters if your site is aimed at an English-speaking market.
You may make even bigger savings if you require a selection of characters that does not change often, such as a navigation menu.
4) Utilize the most up-to-date arrangement
As people have come up with better ways of compressing them into smaller document sizes, fonts come in many different different formats. Therefore, in the event that you use a custom font, then try to be certain you’ve got an arrangement readily available for browsers which support it.
5) Start displaying text in a fallback font
Some browsers, such as Internet Explorer, will do this. Text appears in a font, like Arial, whereas the browser waits to load. The custom font is then switched in as soon as it is available.
This does result in a fantastic user experience if the fallback is different in the font. But if it’s very important to get text to display as fast as possible, and it’s not too jarring for the end user, there are ways to get browsers to behave in precisely the same manner.
Are habit fonts worthwhile?
It would be a mistake. They’ve made the internet a richer area and often help to communicate a consistent brand identity.
It is just important to understand the advantage in addition to the cost, and to take a few simple steps to minimise the impact on site rate.