Welcome to the Web - Rocketface(R) Workshop Webmaster's Tutorial - "How to Design a Website" Rocketface(R) Home - Welcome to the Web
Webmaster's Tutorial -------------- Webmaster's Tutorial Index -------------- Article Archive -------------- Sitemap -------------- Privacy -------------- About

Webmaster's Tutorial
About Domain Names
About Web Hosts

Analyze Website
Analyze Audience
Target Audience
Demographics
Website Goals

Organize Website
Website Basic Layout
Website Structure
Website Sections
Website Content
Website Navigation

Develop Website
Website Construction
Sitemap Construction
Webpage Construction

Implement Website
FTP Website
Fine Tune Website
Upload Organization
User Interaction

Maintain Website
Maintenance Plan
Website Optimization
Optimize Website
Website Promotion
Website Traffic Analysis

Resources
Main Site Index
Article Archive

Website Assembly
Putting together all the elements of your website

Organization of your website directory folder

Now the time has come to assemble your website. Gather together all of the elements that make up your website: webpages, scripts, graphics, forms, etc. and place them in a directory folder dedicated only to your site. This directory folder should be organized on your hard drive just as you intend it to be organized on the internet.

When you have organized your website directory folder in this manner you will have all of the building blocks that make up your site at your immediate disposal. This will provide for easy maintenance and manipulation of your website in the future.




Checklist for assembling your website

Use the following checklist to be sure that you have assembled your website correctly. The main points are as follows;

  • The first (index/homepage) page should fit, on screen, in an area 640 - 800 pixels wide by 460 - 820 pixels high.

    This ensures that nearly every visitor to your introductory page will see its important information.
  • Short text lines in all links

    Be as descriptive as possible in your text links but keep them short. (i.e. 40-60 characters).
  • Short paragraphs

    Visitors scan webpages and only read the information that they are looking for. Long paragraphs are difficult to read on a computer screen. Keep them brief. (i.e. 4-8 Lines).
  • "Alt" labels on all graphics

    Search engines and websurfers who are without graphics capabilities cannot see images. The "alt" tag is a way to describe the missing image.
  • Index or sitemap for large website

    All websites should have a sitemap. It is the backbone of your website navigation system and provides access to all of the pages in your site at a glance.
  • Color coordination

    Use only two or three basic colors for your website and stick to that color scheme throughout your site. This provides continuity. Also, be sure to reflect this in your text link colors.
  • Quick download time

    People do not like to wait while a webpage is being downloaded. Optimize website your index/homepage to download in less than 30 seconds, the quicker the better.
  • Use of browser-safe color palette

    If you want your website graphics and text to display uniformly for all of your visitors use browser-safe colors only.
  • Clear, easy to follow navigation

    Website navigation is the single most important factor in providing a pleasant experience for your visitor. Simple is better when designing your navigation system.
  • Consistency from page to page

    Visitors will know they are still on the same website regardless of which page they are viewing. Use common headers and footers throughout your website.
  • Organization of the information and of the website

    Simplicity and order must be the rule when you set-up your website. This is as important to you as it is to your visitors, now and in the future, as your site begins to grow.
  • White space or negative space

    This is how to direct your visitors eye around a webpage. Make good use of borders, line breaks and spaces.
  • Contrast of text and background for easy reading

    Remember, reading on a computer screen is hard on the eyes. By providing high contrast and low key backgrounds on your webpages eye fatigue will be reduced.
  • Good object/text alignment

    A balanced webpage layout is imperative for a professional appearance. Pick an alignment style and stick with it. This also helps your visitors comprehension when they read the content of your website.

Note:

Always try to keeps things 1024 pixels wide or less wide, unless you are employing CSS controls, simply because you want to design for the lowest common denominator or screen resolutions.

By most surveys 800x600 is still a major screen size, especially for newbies. Some have less, going as low as 640x480, but to design for that just doesn't leave enough space to accomplish anything worth doing.

If you need more room then design your page length to accommodate it. Just try to keep the number of down clicks below three.



BACK: Writing for the Web NEXT: Implement Website



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