We often have to have the awkward conversation with our clients about why we can’t use the font they want on their website. It’s a conversation we don’t like having, particularly when a client has spent quite a bit of money on a style guide from another designer or agency.
They present us with their style guide – a beautifully designed logo and accompanying fonts to be used throughout their online and offline marketing – but the fonts either cost per visitor to use, are expensive and the client isn’t wanting to pay for them, or simply have no web compatible version.
Unfortunately designers who do not have experience working in the digital space do not always understand the importance of providing web alternative fonts in the style guide.
All fonts used online must be compatible with the web. Even if your using them in your email signature! If they are not, the font will be substituted with a web friendly font if the visitor doesn’t have that exact font on their device and probably display in a way you may not like, such as Arial or Times New Roman. You have no control over this substitute font as it will be chosen dependent on the fonts available on the computer or mobile device the website visitor is using.
Professional developers like us will never allow this substitution to happen. Instead we always use web friendly fonts, with us you can rest assured your website will display the way you want it to on each and every device.
Option 1. There used to be only a handful of fonts that we as web designers and developers could use on websites these were known as ‘Web safe fonts‘. You can still choose a web safe font, these are system fonts that are installed as part of the operating system of computers and digital devices. The include: Arial, Courier New, Georgia, Impact, Lucida Sans, Palatino Linotype, Book Antiqua, Tahoma, Geneva, Times New Roman, Trebuchet MS, Verdana. And yes, they are all very basic (and boring).
Option 2. You can choose from any font that is available through an online font system such as Google Fonts or Adobe Typekit. Using some development code your developer will be able to ensure that any font you wish to use in these collections will display the way you expect it to on any device.
Option 3. This is purchasing a web license option for your particular font or purchasing the font, much like you would purchase the rights to use a particular song in your advertising. Depending on the license options you may own the rights to use the font for the life of the website or you may be licensed to use the font for a certain number of views before you need to renew the license. For sites that attract a lot of traffic this can add up.
If the font is just being used as a heading or similar then you may have the option to be able to create image files for these particular items. (All developers will cringe to read this!) It’s not a recommended option, and Google won’t like it, and it won’t effect your Google ranking in a positive way because Google won’t know what these image headings say. This is not something we recommend doing but if you must please remember is that the image files must be optimised for web otherwise they can cause other issues, including slowing the site down.
When selecting a designer to brand your business, choose one who has experience designing for the web (like us!), chances are they will be familiar with web alternative fonts and accommodate for this in your style guide. No matter what option you choose you want to be given the chance to make an informed decision prior to completing a re-brand. We hate when clients are shocked at the final delivery of a website as they have to modify the fonts utilised within their branding guidelines. This is particularly hard for them to do if they have had it drilled into them that they cannot do anything outside the branding guidelines.
Advice: Always remember to include the requirement of utilising web alternative fonts in your initial brief or choose a design agency that is able to take you through a full branding experience as they will automatically take this into consideration.
