In Part 1 we talked about fonts and how many you should use on your site. The General rule is to use no more than 3 fonts.

Here is a guide you can use when applying the fonts you’ve chosen to your web site.

Font choice #1: Headings

Your website headings should be larger than the rest of the content on the page and usually in a colour that stands out (by this I don’t mean that you need to pick a bright colour, just a colour that is different from the content and has enough contrast).

For headings, serif fonts are generally easier to read and stand out from large amounts of sans-serif content.

Headers should be the same font throughout your site. Having different heading fonts, font sizes and colours can confuse the reader which may discourage them from continuing or returning to your web site.

Font choice #2: Body Copy

Your web site’s main content (body copy) can be either a serif or sans-serif font, however use a sans-serif font when text is below 12px - serifs can begin to degrade if the font is any smaller.

Don’t use solid black as a colour for your content – the contrast is too much against a white background for large amounts of text. Instead use a dark gray such as 65-80% black, for example the colour of content on the IGLOO web site is - hex value #848484. By using a gray tone the eye can read more, longer before feeling strained.

Font choice #3 (optional): Callouts/Special links

Your 3rd font choice is optional. This font should be reserved for special callouts, such as promotions and links to special areas on or off your web site. Use this font sparingly to draw attention to links that are most exciting and important. Remember what we talked about in Part 1, don’t under estimate the versatility of font families. Instead of introducing a new font all together try different versions of the same font.

Consistency plays a key role in earning the trust of each person that visits your website. The more consistent you are in using and implementing your font selections the less guess work there will be. It should be very clear what a header is, what is content and what is a special callout/link. If you are consistent the person looking at your site will quickly learn what these elements are for your site and instinctively know what to look for on other pages.