Web Page Design Guidelines Part II:
Good and Bad Ideas for web design for Academic Websites


HOME University Policies Web Page Guidelines Presentation Guidelines Helpful Website Links Tutorials

The information found on this page is intended to be taken as "strong" suggestion of good site design as it relates to the guidelines set by the summer program staff.  Blatant failure to follow these guidelines in any way will result in pages being stripped of the violating content. In this context, "violating content" refers mostly to color usage and  images display (especially background images). Refer to this page as often as necessary during the design of your sites.

 
Elements of Good Design
Guidelines Home
*Design Tips*
Helpful Links
There are a multitude of resources available that inform the budding web-developer on the ways of good web page design.  In general, we have come up with some general elements that are most important to having an acceptable site for public access:

  1. Organization: this is among the most important aspects of website design. Essentially, your pages should be organized into clearly defined sections (as described on the main guideline page). The worst thing to do is confuse your audience with an un-organized jumble of pages.

    File placement is another element of simplicity in organization.  For instance, if you know you will use a lot of images, create an image folder as a subdirectory for each subject area. Or simply create one large image directory. If you have a lot of pages for a subject, create a sub-folder with the appropriate contents placed in that folder.

  2. Understand your audience: Since there are a wide range of readers, you as the author should be always be aware of your target audience (children, general public, or members of your research community).   For instance, assume you know that your audience is the general public, and you know that you will mention uncommon terms on your pages. You should be prepared to have appropriate illustrations or definitions of the uncommon terms.

  3. Focus on Content:   once you understand who your audience is and you know how you wish to organize your pages,  your next goal is to focus on content.  At this point you should be focused on keeping your content relative to the subject matter as defined by the structure of your site. For instance, if the pages that you're working on are about research, don't go off on tangents talking about irrelevant topics like sports.

    Along the lines of content you should make sure to look for relevant images, graphs, or illustrations to go along with your information. Just like presentations, the reader can become easily bored with just text if there are no interesting images to accompany your content.

  4. Work on the Design:   your next objective is to get going on the overall "look" of your website. The things to focus on in this area are:
    1. Page Styles and Content Placement -
      many will base the design of their site on that of their favorite professionally designed websites. While this is a good idea, it is often pretty difficult to achieve the "exact" styles used on a professional site.  As a beginner, it always good to have a model to work from.

    2. Navigation - Make sure that a user can navigate through your entire site. No links should lead to a dead end!

    3. Color usage yet another very important aspect of web design. It is suggested that you consult color theory, color wheels, or simply ask others opinions about your use of color on your site. The last thing you want to happen is for someone to say
      "OOOH...[insert derogatory comments]"

      Hint: Print your pages... if you can't see it on paper then you probably picked the wrong colors.

  5. Make sure everything works!!!
    Don't assume that just because you have a preview mode in your website editor that your pages will work exactly as they do in the editor. Oftentimes, browsers act differently and can cause your content to be displayed incorrectly.  You should make sure to upload your web pages to it's intended site and view your site from the web-server

    Things to make sure work:
    • Links - make sure all the pages exist and are properly linked
    • Colors -  make sure the colors are displayed in an acceptable manner
    • Images - make sure all the images referenced in your pages show up in the correct places
    • Print it!!! (if you can print it it's good...)



Elements of Bad Design

Things to avoid:
  • Dark background colors/background images that require light/white text in order to display your content
  • Gaudy/Busy images - it's not good if the image draws too much attention away from the content
  • Non-standard wording - This is not AOL Instant Messenger... pseudo-short-hand is unacceptable. Non-standard capitalizations are unacceptable unless it actually represents an Acronym of some kind.