logo
g Text Version
Auto
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Society & Culture
Sports
Travel & Leisure
TV & Movies

dailyclick
Bored? Games!
Postcards
Astrology
Take a Quiz
Rate My Photo

new
English Garden
Costuming
Charity
Women's Fashion
Pop Music


dailyclick
All times in EST

Full Schedule
g
g HTML Site
Elizabeth Connick
BellaOnline's HTML Editor

g

Choosing the Right Font for Your Website

In order to get the most from your content, you need to present it in the best possible way. Think of your site's font choice as a painting's frame. Even if it's a masterpiece, the wrong frame will distract the eye and lessen the painting's impact.

Fonts come in two basic types: serif and sans-serif. A serif is the little perpendicular line at the end of a letter stroke; serif fonts include Times New Roman (the default Word font), Garamond, and the New Century family of fonts. Sans-serif (meaning 'without serif') fonts do not add these finishing lines at a character's endstroke; popular choices include Arial, Helvetica and Verdana.

A debate has raged for some time as to whether serif or sans-serif fonts are the better choice, and no one has been able to offer conclusive proof one way or another. To begin with, websites used sans-serif fonts and paper designers used serif fonts, but that's certainly not a hard-and-fast rule and there are plenty of exceptions on both sides.

Once you've decided on serif or sans-serif for your main font, you now have to narrow your options down to a particular font. This can seem like a daunting challenge, since there are thousands upon thousands of fonts in existence. In reality, your options are a bit more limited than that.

If you choose an obscure font and your visitors do not have that particular font installed on THEIR computers, then their browsers will be unable to display the font. Instead, the browser will make a "best guess" and display the text in what it thinks is the closest font from its available options. This can easily destroy your site's layout. Thus it's best to choose a basic font, one that comes pre-installed on most or all computers, so that you can be sure your visitors will see what you want them to see. Most website builders use the CSS "font-family" rule to designate what secondary and tertiary fonts to use in case your first-choice font is not available for a particular visitor.

You should also take readability into account. Some fonts are quite difficult to read on a computer screen, particularly if you decide to use a smaller size. Many older fonts were designed for printers and later adapted for the screen (and some adapted better than others).

My personal favorite fonts are Georgia for serif work and Verdana for sans-serif. Both are screen fonts, designed for use on a monitor; both are highly readable and both are widely installed on computers around the world. When selecting a fallback font, I usually designate Arial as a secondary for Verdana and Times New Roman as a secondary for Georgia. These fonts are close enough to my first choice fonts that if a visitor to my site doesn't have the primary font installed, the page should degrade smoothly when displayed in the secondary font.

RSS | Related Articles | Previous Features | Site Map


Content copyright © 2008 by Elizabeth Connick. All rights reserved.
This content was written by Elizabeth Connick. If you wish to use this content in any manner, you need written permission. Contact Elizabeth Connick for details.

Digg! g delicious Save to Del.icio.us

g


For FREE email updates, subscribe to the HTML Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor

g features
How to Add Special Characters to Your Website

Getting Paid for Ads on Your Site

How to Post a Caption for Your Images

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Driving Amount
Much more
Slightly more
Slightly less
Much less

g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2008 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor