Close Nav

Search

This post is more then 3 years old, some information may be out of date

Non Standard Fonts

All computers / devices, whether they be a Mac, PC or a mobile device such as an iPhone or Android device, come with a series of standard fonts (basically they are pre-packaged).

However, we are often asked by our clients to use their “corporate font” on their website.

If this corporate font is one of the “standard” fonts, this is not a problem.  However if it is a non-standard font it can cause issues for users who do not have this font installed (see note ** below).

A bit of background

Usually when we design a website we apply a “font style” to headings and body text.  This style usually consists of a main font, and two or three “backup” fonts.  So we might set a heading to use “Arial”.  However if Arial is not installed, then it will display as Verdana.

Unfortunately we can only set one particular “font size” (so in the example above we can set a heading to be 12px Arial or 12px Verdana).  However 12px Verdana is slightly bigger then 12px Arial (this is how the fonts are designed). 

There doesn’t appear to be much of a difference… however not all fonts are created equal.  Try comparing 12px Verdana to 12px Calibri:

difference in font sizes

How we get around this problem (sometimes)

Typekit is a service (that TMD pays an annual fee for) that embeds non-standard fonts within a website.  This means that although the end user may not have this font installed, they will still see the website with this font displayed.

A couple of important points:

·         We recommend only using Typekit for “main” headings (not body text)

·         Not all fonts are available via Typekit

 

** Advertising agencies should provide you with a “web style” font that can be used for online purposes.