Typeface On Your Website Does Matter

04 February 2011  |   Back to center  |  1499 views

Regardless of the prize-worthy design on your website, none of it matters if the typeface doesn't display properly, is difficult to read, or isn't widely used.

Your page design begins with your typography decisions and progresses from there. When you talk about typography on the web, you are talking about three things: typeface, type size and type color.

Sans Serif fonts

If you have no idea about fonts, how they translate to your website or how they will affect your visitors and ultimately sales, then you should stick with a sans serif font.

Fonts such as Arial, Helvetica and Verdana don't have the 'tails' at the ends of each character. The reason for using them is that these fonts are the most legible and provide the best readability for visitors in a low resolution atmosphere. Don't take risks with your fonts, go generic and use a sans serif font. Your visitors will thank you for it.

The reason these fonts are so popular is because they are easy to read on computer screens with low resolution. As a result, most of the time fonts that are unique and distinctive are not used on web pages so as not to distract the reader from what is trying to be said and communicated through the font on the page. Since the website uses content to get the point across, it is crucial to use fonts that are easy to read. If you make it difficult for a visitor to read the content, they will more likely leave than put forth the effort.

Simple is Safe

Don't let yourself get carried away with your fonts and designs. Instead, keep in mind that simple is safe. Keep it simple and easy to read.

The fancier the font, the more it should be limited to logos or banners or for use as part of an image. Using a fancy, specialised font may look good to you, because that font may be installed on your computer, but if hundreds of potential clients of yours don't have that font installed on their computer, your website may not display correctly.

Unless you're a web designer, of course, a Windows, Macintosh, or other system will have only a handful of fonts installed. Take a look at common fonts on Windows systems to March 2008 below:

Typefaces carry their own unique subliminal emotional power

Arial creates a clean, current up-with-the-times image, while Times New Roman creates a stable, established image. Other typefaces may remind readers of a Peanuts cartoon strip (Comic Sans) or theatre signs (Playbill). You can see various fonts in the Adobe Type Library.

What's the best font size to use in website design?

Well, there is no 'best font size'. Just don't 'fix' your font size absolutely. The rules regarding type size are a little more cut and dry. For text paragraphs, you shouldn't use anything smaller than 10 point type; for headings, use 12 point type or larger. As with your typeface selection, consider your audience and its own needs in terms of accessibility. Try to avoid using 8 point type (except for copyright notices, etc.).

You may be aware that the same font, at the same point size on a Macintosh 'looks smaller' than on most Windows machines.

Small fonts are more difficult to read

Make your default font size reasonably big (at least 10 point) so that very few users have to resort to manual overrides.

If your site targets senior citizens, use bigger default font sizes (at least 12 point). You might say 'but the text looks too big'. Consider adding a button that loads an alternate style sheet with really big font sizes if most of your site's visitors are senior citizens or low-vision users. Let your readers have the option to make it bigger or smaller in their browsers, depending on their tastes or needs.

The allure of color

Selecting a type color can be further complicated by a colored background. As a rule, you will want to avoid putting text on patterned backgrounds, including fine lines and stripes, because it will make text difficult to read. Here are some simple rules to follow:

•    The best color for text is black or dark color.

•    The best background color is white or a very light color.

•    If you do use a dark background with light text, use it sparingly and make sure the text is large and bold enough to see clearly or it will 'disappear' into the background.

•    Maximize the color contrast between the text and the background (and do not use busy or watermarked background patterns). Despite the fact that low-contrast text further reduces readability, the Web is plagued by gray text these days.

Remember: This is also enforced by law. A professional web designer will always take into account the requirements of the DDA Act that regulates laws for people with disabilities. We will give you advice on it in our next newsletter.

Contact us if you need optimal web design.

Sincerely,
HeadChannel Ltd
www.headchannel.co.uk

Back