Web-Safe Fonts For Your Site

Choosing the right typeface for your website copy isimportant, since it will affect the way your readers perceive your page(serious and formal, or friendly and casual). Aside from this, thereare also important usability concerns. For example, some font types aremore easily readable than others, and some are more widely available.

You want to choose font types that:

1. fit the character of your site,

2. are easy to read on a computer screen, and

3. are widely available across many browsers and operating systems.

There are basically two types of fonts: serif and sans serif.Serif fonts are those that have fine cross-lines at the extremities ofthe letter. Sans serif ("sans" being the French word for "without") arefonts that don't have serifs. The most common serif font is probablyTimes New Roman. Arial is an example of a common sans serif font.

Let's go briefly through the most popular font types and evaluate their availability, readibility and character:

Arial*:

Availability: Thoroughly available. It is probably the mostcommon sans serif font. It is the default font for Windows, and itfirst shipped as a standard font with Windows 3.1.

Readability On Screen: Not the worse but definetely not thebest, especially at small sizes, when it becomes too narrow and thespacing between characters too small.

Character: Has a streamlined, modern look but is also plain and boring.

*For Mac users, the equivalent of Arial is Helvetica.

Times New Roman: :

Availability: Thoroughly available. It is probably the mostcommon serif font. It is the default font for web browsers. It wasfirst shipped as a standard font with Windows 3.1

Readability On Screen: Acceptable for font sizes of 12pt. and up, but terrible for smaller sizes.

Character: Serious, formal and old fashioned.

* For Mac users, the equivalent of Times New Roman is Times.

Verdana:

Availability: A widely available sans serif font, Verdanawas first shipped with Internet Explorer version 3, when theexponential growth of the Internet demanded a new font that was easy toread on the screen.

Readability On Screen: Exceptional. It's wide body makes it the clearest font for on-screen reading, even at small sizes.

Character: Modern, friendly and professional.

Georgia:

Avaliability: Good. It is a serif font introduced byMicrosoft with Internet Explorer version 4, when the need for a seriffont which much better readability than Times New Roman became evident.

Readibility On Screen: Very good. It is the best serif fontfor on-line reading, since it was specifically designed for thatpurpose.

Character: Modern, friendly and professional.

Microsoft has also popularized two more fonts: Comic Sans Serif and Trebuchet.

Comic Sans Serif was launched with Internet Explorerverion 3 and mimics the hand writing used in comics. It is easy to readand is informal and friendly, but it is not considered appropriate formore serious, professional sites.

Trebuchet is another sans serif font, similar to Arial but with more character, although it can be difficult to read in small sizes.

Finally, we can mention Courier New, a serif font that waswidely popular with old, mechanical typewriters, and that is now usedonly to present simulated computer code (if you need to present snipetsof sample HTML code in your web pages, this is the font to use.

Therefore, from a usability perspective, the clear winner isVerdana. If you are inclined to use a serif font, Georgia is the bestoption. Arial remains a good option for specific parts of text, likeheadlines and titles, where a different font must be used and you canuse larger sizes.

The way you specify your desired font in HTML is by using the<font face> attribute. The best practice is to specify severalfonts instead of just one, putting the easiest to read first.

For example, if you want to use serif fonts, your HTML codewill look like this: <font face=Georgia, Times New Roman, Serif>. That way, your visitor's browser will try to load Georgia first, butif it doesn't have it installed it will try the next one on the list,in this case Times New Roman; if it doesn't have it either, which ishighly unlikely, the browser will choose the third option, which wehave specified as any other serif font.

For sans serif fonts, the code will look like this: <font face=Verdana, Arial, Sans>.

Fonts for Business Writing: Choosing Between Them
Choosing a font is something that most of us give little thought to. After all, most fonts are more or less the same, right? Lets face it, most writing is presented in a stock-standard font like Times New Roman or Arial. Why is the choice of font important? There are many differences between ....
Web-Safe Fonts For Your Site
Choosing the right typeface for your website copy is important, since it will affect the way your readers perceive your page (serious and formal, or friendly and casual). Aside from this, there are also important usability concerns...
Fonts: Choosing Wisely
Choosing a font is something that most of us give little thought to. After all, most fonts are more or less the same, right? Lets face it, most writing is presented in a stock-standard font like Times New Roman or Arial.
Web Design Mistakes - Text And Fonts
The main purpose people use the Internet is for research, according to most user surveys. While not specifying the kind of research being done, it is safe to assume that people are spending a lot of time online reading. Unless a site is meant to be full of graphics, such as an art gallery or prom...
Improve Your Web Site Design With A Fancy Font
Have you ever tried to design your web site with a beautifully selected font, only to realize that most folks dont have it installed on their computer? This means your web page wont look great to the majority of your viewers. They will only see the font they have on their own computers. T.....
Other Online Factors
Other factors that affect the online environment, and what we can do to mitigate their impact. Simple web designs prove more effective in many ways...
Colour Theory
The colour wheel below consists of 20 basic web safe colours, and is a helpful tool that shows the basic organization and relationships between colours. By choosing the colour opposite a particular colour you can match colours more effectively...
An Easy Way to Choose Attractive Color Combinations
Lots of people struggle to come up with attractive color combinations when designing logos, banners or web sites. So, heres an easy technique that only takes a few minutes...
10 Ways to Achieve Superior Web Site Design
In order to achieve online success, one must have effective and reliable products and services and great web design as well. Many people are judging the book by its cover this is the reason why your website should also be superior...
Web Safe Colours
Web Safe A web safe colour is one that will display correctly on any screen, irrespective of the operating system or graphics card. There are only 216 web safe colours. You can use other colours, but you cannot be sure they will display correctly. A general rule of thumb is: if possible use