Basic Web Design Tips

1.  Plan your "Web" first.  How many pages do you need?  Will each of your pages connect to all others or will some have single direction links.  How many faces will you present to the public and what is the image you want?

2.  Who is your audience?  Do they have high-end machines?  (Lots of graphics can be annoying if they take a long time to load.)  What do you need your audience to know?  (Don't clutter up bandwidth with cutesiness if it detracts from the message.)

3.  Don't forget regular page maintenance!  (Your link to "Traditional Mongolian Music" can turn, overnight, into "See Britney Spears dance naked" if someone doesn't pay their domain name bill!)

 


While Composing:

Alternate text and images with some white space -- the principles of layout and design on a web page are the same as for any other media. Balance art with text and remember that the eye moves best in diagonals.

Proof read your pages; run spell check on your text!  Nothing worse than looking sloppy in public (and, guaranteed, the someone you least want to will find your errors)!

It is better to stay in the 10-16 font size range (10-14 for text, 14-18 for headers depending on the font).  These are most like reading real text on a page, this also conserves room and the viewer won't have to scroll too far.  Avoid huge headers.  Stick with basic fonts like Times New Roman and Arial-- not everyone has old English Gothic, BlackChancery, Vivaldi, or Chiller (didn't see some fancy looking fonts there? I rest my case!) If the font you picked is not on your viewer's computer, their browser will automatically substitute an ugly default font like Courier!  

BTW, switching between too many odd colors and too many different fonts gets annoying after a while (doesn't it!).  Try to pick colors and fonts that will accent without overwhelming.  Stick to 2 or 3 colors for your pages, 1 or 2 fonts, and no more than 3 sizes of font.

Remember the color wheel!  Opposite colors do not work well together!  For instance,  red text on green  or  green on red  will be hard to read and will hurt your readers eyes after awhile.  A good rule is  dark on light  or  bright on dark  for fonts. Better yet, stick to black text on   neutrals  or  pastel   backgrounds.  

If you are adding graphics be sure you are using your own pictures or un-copyrighted clip art.  Using anyone else's artwork, animations, photos, or graphics without express permission is as much a form of plagiarism as using their words without proper documentation.

Horizontal lines can nicely break up sections of text into visual chunks and help keep different topics separated and organized!

 


For help with Microsoft Frontpage read Mike Kapper's web pages at  http://web.ics.purdue.edu/~kapper/teaching/resources/frontpage.pdf

 


Using Netscape Composer:

Don't forget to name your pages!  This is the name that will show up on search engines, when someone saves your page as a bookmark, etc..   Go to: Format > Page Colors and Properties > General. Put your name in as the author.  Give the page a simple 3-4 word (it should fit on a bookmark line) title.  Keywords are how a search engine will find your page.  The description is what the searcher will see in the results.

Having troubles keeping things lined up?  Use invisible tables.  Go to Format > Table Properties and set the "padding" to "0."  Tables within tables is a good way to keep images side by side with text.  If text and images seem to be out of whack within the tables check the alignments in the Table Properties menu.

Once you have an image the size you want click the "Constrain" button to lock it in.  Images can be used as links, too, but you might want to add "alternate text" so your viewer gets an idea of where you are going.

Save regularly!  Netscape will often do "an illegal action" if too many windows are open and will "stack dump" which means it has to close and you lose your hard work.


Here are some handy sites for help with designing your home pages, weblogs, and online syllabi.  Remember to check for copyright before using any graphics, photos, or text and give appropriate credit.  It is also a courtesy to contact any other sites to which you link and ask permission or give them the option to link back to your site.


Free Graphics Sites:  (due to the high-end graphics some of these sites may be slow to load--be patient)



And don't forget to add a disclaimer, contact, and maintenance date to your pages!  Here's a standard format:

This page designed and  maintained by Jana Russ, (return to my Home Page).
Last updated, July 2003.  © 2004 by The University of Akron
The University of Akron is an Equal Education and Employment Institution.