Four
Rules for Web Page Design & Layout
|
1. Your website should be easy to read
|
The most important rule in web design is that your website should be
easy to read. What does this mean? You should choose your text and background colors very carefully. You don't want to use backgrounds
that obscure your text or use colors that are hard to read. Dark-colored text on a light-colored background is easier to read than
light-colored text on a dark-colored background.
You also don't want to set your text size too small (hard to read) or
too large (it will appear to shout at your visitors). All capitalized letters
give the appearance of shouting at your visitors. Keep the alignment of your main text to the left, not centered.
Center-aligned text is best used in headlines. You want your visitors to be comfortable with what they are reading, and most text (in the
West) is left aligned.
|
|
2. Your website should be easy to navigate
|
All of your hyperlinks should be clear to your visitors. Graphic images,
such as buttons or tabs, should be clearly labeled and easy to read.
Your web graphic designer should select the colors, backgrounds, textures, and special effects on your web graphics very carefully. It is
more important that your navigational buttons and tabs be easy to read and understand than to have "flashy" effects.
Link colors in your text should be familiar to your visitor (blue text
usually indicates an unvisited link and purple or maroon text usually indicates a visited link), if possible. If you elect not to use the default
colors, your text links should be emphasized in some other way (boldfaced, a larger font size, set between small vertical lines, or a
combination of these). Text links should be unique -- they should not look the same as any other text in your web pages. You do not want
people clicking on your headings because they think the headings are links.
Your visitors should be able to find what they are looking for in your
site within three clicks. If not, they are very likely to click off your site
as quickly as they clicked on.
|
|
3. Your web page layout and design should be consistent throughout the site
|
Just as in any document formatted on a word processor or as in any
brochure, newsletter, or newspaper formatted in a desktop publishing program, all graphic images and elements, typefaces, headings, and
footers should remain consistent throughout your website. Consistency
and coherence in any document, whether it be a report or a set of web pages, project a professional image.
For example, if you use a drop shadow as a special effect in your bullet
points, you should use drop shadows in all of your bullets. Link-colors should be consistent throughout your web pages. Typefaces and
background colors, too, should remain the same throughout your site.
Color-coded web pages, in particular, need this consistency.
Typefaces, alignment in the main text and the headings, background effects, and the special effects on graphics should remain the same.
Only the colors should change.
|
|
4. Your website should be quick to download.
|
Studies have indicated that visitors will quickly lose interest in your
website if the majority of a page does not download within 15 seconds. (Artists' pages should have a warning at the top of their pages.) Even
websites that are marketed to high-end users need to consider download times. Sometimes, getting to website such as Microsoft or
Sun Microsystems is so difficult and time consuming that visitors will often try to access the sites during non-working hours from their
homes. If your business does not have good brand name recognition, it is best to keep your download time as short as possible.
A good application of this rule is adding animation to your site. Sure,
animation looks "cool" and does initially catch your eye, but animation graphics tend to be large files. Test the download time of your pages
first. If the download time of your page is relatively short and the addition of animation does not unreasonably increase the download time
of your page, then and ONLY then should animation be a consideration.
|
Back to 4th Grade Tech Page