Stunning images, intuitive design, and eye-catching colors are all aspects that combine to create a web site that is both attractive and functional. But there is another component that is equally as important – your choice of font.
Knowing which font to use can make the difference between engaged clients or one-off visits. With the plethora of fonts that are available, which ones will create the optimal impact?
Serif or Sans Serif?
The first step in determining which font to use is deciding whether to use a serif or sans serif font. Serif fonts have tiny lines that extend from the ends of every letter, number, or symbol, and can appear as tails, dots, or flags. They tend to make each letter or symbol more distinct, thereby creating text that is easy to read. They are particularly effective for headings. Choose a serif font when you want to convey personal, artistic, or traditional feelings on your web site.
Because they lack the details of serif fonts, sans serif fonts tend to look cleaner, simpler, and uncluttered, although with less personality. They are easier to read for main body text on web sites.
Common Fonts and the Question of Display
The fonts that you can use depend on the type of computer — PC or Mac — that your web site visitors use. Also, each of their operating systems may offer fonts that are not available on the other, or do not appear as intended. If you want your web site to be viewed on both PCs and Macs, then you need to choose a font that displays equally well on both types of machines. Verdana is an example of such a font, but you will need to experiment to find a common font you like that displays appropriately no matter the computer. Pre-installed fonts tend to be better choices than custom fonts.
If you want to use unique fonts, use them sparingly; you want to create interest while still making your content the focal point of your web site.
Once you have selected a font, you then need to determine the size of the font for your main headings, sub-headings, main body text, and any other text elements.
For your main body text, a common and easily readable size tends to be either 10 or 12 px. Note that the height and width of each letter, number, and symbol may vary between serif and sans serif fonts, as well as from one font family to another. Also make sure that people with visual impairments can easily read your text relatively easily. After all, no one wants to squint to read your content.
After you have selected a size for your main body text, adjust the size for headings and other text elements accordingly. If you are unsure, try a different size until your eye tells you what works.
To add variety, interest, and emphasis to your text, you can incorporate attributes – bold, italics, underline, color – where needed. For example, bold is useful for headings, keywords, and menus while italics can denote key words, quotes, and titles. However, overusing any attribute will make your text look cluttered, busy, and unprofessional. Apply them sparingly yet consistently.
A Last Thought
While your font selection may not seem as crucial as other design elements of your web site, it actually is. Not only do your fonts convey important details about your business, products, and services, they also set the tone and help visitors navigate your site. Take your time choosing the right font and make your web