Free Adobe Photoshop website templates by Colorifer.com. Web design articles
articles.colorifer.com - articles about web design

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.


    MORE RESOURCES:

    MLB.com, iSchool team up for web design contest
    SU The Daily Orange (subscription)
    A contest in the School of Information Studies could bring students face to face with executives from Major League Baseball, as well as provide ...



    Web design and page 1 google
    Online PR News (press release)
    Online PR News – 07-September-2010 – We are proud to announce that as on today 8/9/10 hopping mad designs is on page 1 for the keyword web design. ...
    Web Design | Hopping Mad DesignsPRWire
    Splash the Flash into your Website for Higher Visibilitylonad News
    Phoenix, Arizona Computer Repair Company My PC Techs Announces New Web Design ...Benzinga
    FPRD (press release) (blog)
    all 15 news articles »


    New Web Design For Hostetler's Lawn Furniture
    PitchEngine (press release)
    Digital Hill is pleased to announce the new web design for Hostetler's Lawn Furniture of Indiana, serving the web design needs of the greater Warsaw, ...



    New Web Design For Miller's Buggy Line Tours
    PitchEngine (press release)
    Digital Hill announces the launch of a new web design for Miller's Buggy Line Tours of Shipshewana, Indiana. 09.07.2010 – Digital Hill announces the launch ...



    Wakulla High School Web Design Class Awarded First National-Level Contract
    Wakulla.com
    The Wakulla High School Web Design students were awarded their first national-level contract from NAMI-Wakulla, National Alliance on Mental Illness. ...



    Best Web Design Services
    AddPR.com (press release)
    Since, your web design puts a summary of your whole business; it better be good enough to attract people and bring in more traffic. ...
    Catering to all you internet marketing requirementsAddPR.com (press release)

    all 5 news articles »


    Cost Effective Logo And Web Designing Services In New Orleans, Louisiana By ...
    Online PR News (press release)
    Infintech Designs is a New Orleans web design company that specializes in cutting edge web development, web design, SEM and SEO services in Louisiana. ...



    Lastest Web Design News
    Tom Wilt News
    In response to, and in defiance of, a 25 year “cultural deep freeze” in the UK, the Anti Design Festival (ADF) will be launching a major assault on ...
    Extensis® Releases Suitcase Fusion™ 3 with Adobe® CS5 Integration and ...EON: Enhanced Online News (press release)

    all 9 news articles »


    4 local companies make national lists for fastest growing, best websites
    Gainesville Sun
    “Everybody has a second cousin who read a book on web design and now is a web design expert,” he said. “So getting recognition such as this shows that we're ...

    and more »


    Basics of web design
    Helium
    The basics of web design would involve different aspects. Each of which can take some time. The concept of putting together a web site can ...


    Google News

  • 2007-2008 © Copyright colorifer.com. All Rights Reserved.
    Free Adobe Photoshop templates.
    Web Design Articles | Site Map | Terms of Use