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. For example, some font types are more easily readable than others, and some are more widely available.

You want to choose font types that:

  • fit the character of your site,

  • are easy to read on a computer screen, and

  • 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 of the letter. Sans serif ("sans" being the French word for "without") are fonts that don't have serifs. The most common serif font is probably Times 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 most common sans serif font. It is the default font for Windows, and it first shipped as a standard font with Windows 3.1.

    • Readability On Screen.- Not the worse but definetely not the best, especially at small sizes, when it becomes too narrow and the spacing 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 most common serif font. It is the default font for web browsers. It was first 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, Verdana was first shipped with Internet Explorer version 3, when the exponential growth of the Internet demanded a new font that was easy to read 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 by Microsoft with Internet Explorer version 4, when the need for a serif font which much better readability than Times New Roman became evident.

    • Readibility On Screen.- Very good. It is the best serif font for on-line reading, since it was specifically designed for that purpose.

    • Character.- Modern, friendly and professional.

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

    Comic Sans Serif was launched with Internet Explorer verion 3 and mimics the hand writing used in comics. It is easy to read and is informal and friendly, but it is not considered appropriate for more 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 was widely popular with old, mechanical typewriters, and that is now used only to present simulated computer code (if you need to present snipets of sample HTML code in your web pages, this is the font to use.)

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

    -----

    You can freely reprint this article. Just include the following resource box at the end:

    About The Author

    Mario Sanchez publishes The Internet Digest ( http://www.theinternetdigest.net ), an online collection of web design and Internet marketing articles and resources. You can freely reprint his weekly articles in your website, ezine, newsletter or ebook.

    In The News:


  • pen paper and inkwell


    cat break through


    Effective Website Design For Massive Traffic

    STEP 1:Do your homeworkPlan and think about your content. Think... Read More

    Why Should You Care About Your Web Site Colors?

    **How Colors are Used in web design:**Demarcates screen elements into... Read More

    Free Web Design Advice

    In this article I will give advice and tips of... Read More

    How To Create A Stunning Drop Capital Effect On Your Web Pages

    Drop Capitals are frequently used in many newspapers, books and... Read More

    Your Graphics- Are They Really Working For You?

    (Making Your Graphics Work For You)It's no secret that a... Read More

    Web Copywriting: The Psychology Of Scarcity, Less Is More If You Want Faster Sales

    Countdown to Armageddon - at least you'd think so judging... Read More

    Cool Web Design And Promotion Tips

    This article gives free tips on how to find a... Read More

    Your Website Visitors - Will They Stay?

    I'm sure you've all heard the saying 'Build it and... Read More

    Web Design: Use it to Showcase the Message

    If you are designing a web site for which the... Read More

    Its No Good Having A Killer Product If You Dont Have A Killer Website

    Read the title of this article over a couple of... Read More

    Facts You Should Know About Web Site Design and Search Engine Optimization

    1. Web site File Structure / File NamingMost search engines... Read More

    Website Background Colors and Graphics: What You Need to Know Before Designing Your Website

    Designing your website means you have to be creative, plan... Read More

    Effective Website Design

    In this era of ultra-sophisticated internet marketing and web design,... Read More

    Website Promotion Ideas: 10 Tips On How To Use Your Picture Effectively To Increase Your Sales

    Seeing is believing.One trick to increase your visibility as well... Read More

    Website Design - Choosing Your Colors Wisely

    Colors convey emotions and emotions heavily influence the decision-making process.... Read More

    Handwriting Font Tips - The Personal Touch That Makes a Difference

    Most websites use similar fonts and as a result have... Read More

    The Secrets of The Shriekers

    I am constantly bombarded with all sorts of advertisements, single-page... Read More

    The Psychology of Color in Web Design

    Persons engaged in website design, here's a scoop for you!... Read More

    How To Boost Your Sales Dramatically Using Dynamic Back-end Strategies

    Getting a customer is not easy.Getting a visitor to decide... Read More

    Web Design: How To Get Your Visitors To Stay

    Remember the famous line from the movie Field of Dreams,... Read More

    Choosing A Color Scheme

    When you begin the design of your Web site, one... Read More

    Getting Along With Your Web Designer

    You're all ready to get started creating your web presence... Read More

    Why Long Web Pages are Better than Short Ones

    Many Internet sites that try to sell you something have... Read More

    E-covers for Your Niche Market

    When creating an e-cover the what's the first thought that... Read More

    Pages to Include in Your Website

    What pages need to be included on your website? The... Read More

    Are Web Templates Worth It?

    First off, I am a designer. Now you're thinking, here's... Read More

    Orient Your First-time Web Site Visitor

    Imagine spinning someone around so profoundly and for so long... Read More

    Looking For A Designer To Re-Design Your Website?

    If you were like me and you have just started... Read More

    Reach Out To Billions

    Have you heard of 'Babel Fish'?It's a service provided by... Read More

    Branding Web Strategy Mistakes - Brand Identity Guru

    1. Lack of overall strategy and clear definition of success:Most... Read More

    Recipe For A Good Looking Web Site

    We've all surfed the web and seen some awful web... Read More

    5 Powerful Ways To Get Zero Sales From Your Website

    I want you to imagine a lemon. In your mind's... Read More

    Speed Up Or Lose Out! How To Improve Your Websites Download Speed

    So your web site's online and you've got high rankings... Read More