Web Page Design

Links: Start with Content and Structure will follow

 

  • Check for broken links on a regular basis

  • Use relative pathnames (e.g., ../AnotherDir/file.html) instead of absolute pathnames (http://www.gb.nrao.edu/~yourname/AnotherDir/file.html

  • Use http:// and ftp://; think twice about using mailto:.  Instead use:

    <form action="http://www.nrao.edu/cgi-bin/contact" method="post">
    <input type="HIDDEN" name="key" value="Ronald+Maddalena">
    <input type="SUBMIT" value="Contact Ron Maddalena">
    </form>

    See below for an example.

  • Use anchors judiciously

  • Image links and image maps are cool but remember a user can turn off image viewing so use ALT's and TITLE's for image links and image maps, respectively.This is a linear tree

  • Don't "Click Here"

  • Use default link colors, don't confuse your viewer by changing them.

  • All links should be descriptive.  You can create a link to "myfile.jpg" but instead of placing just 'myfile.jpg' as the link text on your web page, either:

    • add a description next to the link (e.g., myfile.jpg (An image of a cow)

    • Use the description as the link:  An image of a cow

    • Put the link as part of a sentence.  "The quintessential country scene always includes a couple of cows"

  • If you are linking to something big, warn the user of the size of the file (e.g. , myfile.jpg (An image of a cow; 120 kBytes).

  • For navigation, consider using image arrows for 'forward', 'back', 'home' as well as a navigational text menu.

  • Only rely on the browser's back button when absolutely necessary. Avoid having to say: "Click on the back button to return to..."

Last Updated on September 05, 2002

Copyright 1999 Associated Universities Inc. Washington D.C.