Web Site Design Tips for SCS Webmasters

• Do not place too much information on each page. Most web site design references state the size of your page should not be larger than 40 - 60 K (in most cases). It is best to keep your top level web pages (the index pages for your main categories and your home page) under 20K. Someone using a 28.8 bps modem connection would take approximately ten seconds to load that 20K page.
  
  
• Place the most important information at the top of each web page. Avoid requiring a great deal of scrolling. Web pages should be, at the most, two 8.5 x 11 pages in length when printed.
  
  
• Some of your pages may be longer than 2 pages and may require scrolling. If this is the case, provide a "Table of Contents" at the top of the content section which provides links to anchors in the document. This will keep your visitors from being required to scroll and search to find information. For an example, see the Collierville High School Student Handbook. Even though this document is divided into two pages, both pages are rather long (both pages are 56K). The "Table of Contents" allows the visitor to find the information they need as quickly as possible.
  
  
• Make the text easy to read against the background being used. Dark text on a light background is the most user-friendly approach.
  
  
• White space (also known as negative space) is very important. It is the open space between design elements. It is essential for providing spatial relationships between visual items. White space guides the reader's eye from one point to another. Without an adequate amount of white space, text would be unreadable, graphics would lose their emphasis, and there would be no balance between elements on the page.
  
  
• Keep text aligned to the left. Save the center alignment for headlines and titles.
  
  
• Make use of the hypertext concept. Link pages together by using the content. This will lead your visitors to information quickly. For example, on your "Clubs" page, link the name of a club sponsor to that teacher's page so a visitor can learn more about that teacher. Don't forget that the use of anchors in links can save a visitor even more time.
  
  
• Make proper use of the HEADER element (<h1></h1>, <h2></h2>, <h3></h3>, <h4></h4>, <h5></h5>, <h6></h6>). This will help visitors using assistive technologies to navigate your page.
  
  
• Write for the web. Content that is simple and to the point will help your visitors find information quickly.
  
  
• Make sure all web pages are free of spelling and grammatical errors. After you check your page for errors, have someone else proof-read it for you. They may find errors you missed.
  
  
• Make sure content for the school web site complies with posted guidelines of educational aims. Also review the other SCS Web Page Guidelines.
  
  
• Make sure all external links are evaluated for appropriate educational content. The standard disclaimer should appear on every web page that contains external links.

  "Neither _______________ School nor Shelby County Schools is responsible for questionable or controversial content found through links external to this site."

• Make sure you have a permission form for any student who has his/her name and/or picture posted on the web site. You can see the form used by Collierville High School by downloading this PDF file. If being used for a student Grade K-8, it will need to be modified. Remember, in grades K-8, student authors of electronically published work may be identified only by first name. Schools may choose to let students adopt “net names”. In grades 9-12, student authors of electronically published work may be identified by first and last name. All student work published must pertain to a class project, course, or other school-related activity.
  
  
• Make sure that every file has a file extension to identify the type of file it is. Common extensions: .html or .htm, .gif, .jpeg or .jpg, .pdf, .txt.
  
  
• Make sure that file names do not contain spaces or special characters. The only special character exceptions are the _ (underscore), - (hyphen), ~ (tilde).
  
  
• Make sure that file names have only one period. The period is used to separate the file name and the extension.

Introduction - Planning
Purpose - Structure - Basic Web Site
Design - Navigation - Accessibility
Place Content - Update - Evaluate