Webmaster's tutorial: Analyzing website Organizing website Developing website Implementing website Maintaning website
Welcome to the Web - Rocketface(R) Workshop Webmaster's Tutorial - "How to Design a Website" Rocketface(R) Home - Welcome to the WebHow to Design a Website - Webmaster's Tutorial StartRocketface(R) Webmaster's Workshop
Rocketface®Workshop Webmaster's Tutorial Index Webmasters Article Archive Sitemap Privacy About
Rocketface®: Webmater's Workshop
  • How to Design a Website
  • About Domain Names
  • About Web Hosts
  • Free Web Hosts
  • Private Web Hosts
  • Types of Websites
  • Building a Website
  • Analyze Website
  • Analyze Audience
  • Analyze Content
  • Website Design Tips
  • Website Journal
  • Effective Communication
  • Target Audience
  • Demographics
  • Website Goals
  • Organize Website
  • Website Basic Layout
  • Webpage Design
  • Website Navigation
  • Website Structure
  • Website Sections
  • Website Theme
  • Webpage Layout
  • Website Content
  • HTML Editors
  • White Space
  • Develop Website
  • Sitemap Construction
  • Webpage Construction
  • Website Assembly
  • Website Construction
  • Typography - Fonts
  • Typography - Style
  • Typography - Layout
  • Website Graphics
  • Website Templates
  • Implement Website
  • FTP Website
  • Fine Tuning Website
  • Upload Organization
  • Ftp Checklist
  • User Interaction
  • Maintain Website
  • Website Promotion
  • Marketing Website
  • Viral Marketing
  • Content
  • Product Sales
  • Affiliate Programs
  • OnLine Services
  • Optimize Website
  • Keywords
  • The SEO Process
  • Website Traffic Analysis
  • Increasing Website Traffic
  • Links Tracking
  • Link Baiting
  • ROR RSS Sitemap Generator
  • Summary
  • Resources
  • Types of websites
  • Hex codes
  • Toolbox for webmasters
  • Free template downloads
  • Optimize your website
  • Resources
  • Glossary
  • Newsletter
  • Feedback
  • Main Site Index
  • Article Archive


  • Something a little different
    XtraAstrology - Exploring the arcane
    moonGROW - Moon phase gardening




    Typography and Website Design - Fonts
    Use the proper type fonts to create a professional looking website

    Typography on the Web

    Fonts

    Typography is the appearance, style, and arrangement of text; a very important aspect of your web site. If visitors have difficulty reading the content, they won't use your site.

    If you are creating a strictly personal website with a restricted audience, then you have more leeway in the typography of your site. For those creating a business web site, or an informational site that will hopefully attract a lot of visitors, there are a number of things you need to keep in mind.


    Appearance and Readability

    We all know that a serif font, such as Times New Roman, is recommended for business correspondence. The "hats and feet" on the letters make text easier to read on a printed page. On the web, the opposite is true.

    With a serif font the letters tend to run together when viewed on an electronic display. This can make it difficult for your visitors to skim through your body copy (i.e. content) and locate the information that they are seeking. See the graphic example below.

    Example of a Serif Font Example of a Sans-Serif Font
    Times New Roman

    An example of a serif font used for printed pages.

    Verdana

    An example of a sans-serif font used for web pages.

    On the other hand a sans-serif (no hats and feet) font, such as Verdana, is much easier to read and makes a web page look cleaner and less cluttered. Using a sans-serif font makes it much easier, for the visitor to your website, to read or scan your website content and body copy for the information they are looking for.

    Note:

    Times New Roman is the default text on web pages, so you will need to specify the font you want to use when you set-up your web pages.

    Core Fonts

    For the bulk of the text or body copy on your web pages, use a common font or core font. These core fonts are installed on most computer systems. See the examples below:

    ArialArial - (sans-serif font) often used on web pages

    Comic SansComic Sans - (serif font)

    CourierCourier - (serif font)

    GeorgiaGeorgia - (serif font)

    ImpactImpact - (sans-serif font) often used for headlines on the web

    Trebuchet MSTrebuchet MS - (sans-serif font)

    TahomaTahoma - (sans-serif font)

    Times New RomanTimes New Roman - (serif font) commonly used for printed materials

    VerdanaVerdana - (sans-serif font) commonly used for web pages

    What fonts are right for your website?

    Are these core fonts the ONLY ones you can use? No. If you are creating a web site for an intranet, you can use any font installed on your computer as everyone with access to the site will have the same font list.

    For the Internet, there are many other fonts that are fairly common. (However, if you want everyone to view your pages as you designed them, it is still safest to use the core fonts.)

    Using graphic fonts

    You can use any font you want for titles, logos or headings ... IF you create them as graphics. That way, everyone will see the font correctly regardless of what they have on their system.

    Of course, the other side of that coin, is that the more graphics you have, the slower your pages will load. This can work against you if it causes visitors to give up and leave your website.

    Note:

    Don't use several different fonts on your web site. One sans-serif and one serif font, with all the variations of bold, italic and color, is more than enough to allow for freedom of design.

    Designing Web Pages

    Designing Web Pages
    Designing good webpages begins with good webpage layout. So what do you want on this most important first screen?
    Professional Webpage Layout
    Examining the methods of professional webpage layout. The individual pages in your website must have a layout that allows the visitor to find out as much as possible about your webpage at a glance.
    All About Design Principles and Elements
    Basic website design elements to consider. A truly shocking number of web designers are unfamiliar with the basic principles and elements of design.
    Designing your Homepage
    Believe me, you want your visitors to stay as long as possible. This is the only way your site is going to succeed. Your site must be interesting, persuading, and easy to navigate.
    The Best Page Layout and Design for Content Websites
    To understand which layouts work you only need to look at the industry gorillas. These are the online content publishers who have been around for years, and who have tested just about every layout combination.
    Writing for the Web
    Writing for the Web is very different from traditional writing. The way website visitors read Web copy is unique and you must adjust your writing style to be effective.
    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, here's an easy technique that only takes a few minutes.
    Professional Graphics
    Graphic design is an intimidating subject for many Internet entrepreneurs. However, most of us must learn some basic design techniques to avoid the high costs of hiring a professional graphics designer.
    9 Ways to Make Your Web Site Look Great
    Learn how to design a website that gets attention every time. Avoid the mistakes most people making when creating their first web site. Take home some tricks that even the most advanced designers will enjoy.
    Selection of Web Templates
    An important part of website designing is selection of web templates. Here are a few points which will help you select the best web template for your website.
    Creating a Basic Web Design Template
    A "template" is simply a design format which you can apply to all (or most) of the pages in your web site.
    Website Optimization - Optimizing your websiteMarketing Website - Marketing your websiteWebsite Managment - Managing your websiteWebsite Design - Designing your websiteRocketface(R) Webmaster's Article Archives



    Back Next



    Copyright© 1999 - 2010
    Rocketface® Graphics
    Rocketface® Workshop Analyze Organize Develop Implement Maintain Site Map Index