Class Web Page Guidelines
Content, Layout/Design, Templates, Text, Graphics,
"Borrowing"Graphics, Names or Photos of Students, Quality Control  

Content
The content is up to you and will vary depending upon the time you have to design and maintain your page.  You might consider the following components:

  • Course Description
  • Outline
  • Syllabus
  • Lecture Notes
  • Assignments (short and/or long term)
  • Links to curriculum-related sites
  • Grading Criteria
  • Student Responsibilities
  • Biographical Info
  • Contact Info (your availability and preferences)

Because this is a school web page, please include the school name and address, and links back to the main SMES site and to the Lower, Middle or Upper Resources page.

Layout/Design
It helps to have a visual "flowchart" before you begin working, so you may want to sketch out the organization of your page with pencil and paper.  

Users should be able to navigate your pages with very little effort.  Each page should include links to the other sections of your class pages.

You should come up with a sort of "logo" to give consistency to your pages.  You might decide to use a larger graphic on your main page and then a smaller version on each of your sub pages to establish consistency.

Think about a color scheme for your class page.  You may want to choose colors that are part of the logo in order to tie together all the pages you create.

We recommend white or light-colored backgrounds.  Even the flashiest web designers have abandoned the crazy backgrounds that were popular a few years ago in favor of lighter backgrounds.

Using a Template
Once you've decided on a general look for your pages, you may want to create a template that includes your color scheme, logo, background, etc. The template should include the common information that you plan to include on each page.  Using a template will streamline the creation of new pages, saving you lots of time and effort. 

Read the "How To" instructions for creating and using a template.

Text
Web sites are "read" differently than printed text.  It is advisable to limit your text to bite-sized sections.  Use white space or dividing lines to separate areas of text.  The orientation of most computer monitors means that reading dense text all the way from the left to the right can be tough on a reader's eyes.  To help your readers, put text in a table in order to create margins.  Notice the text on this page.  It's in a table that spans 70% of the total width of the page.

Limit your fonts to those fonts that are read by all browsers:  Arial, Courier, Times New Roman, and Verdana.  Yes, you'll see other fonts available in FrontPage.  However, visitors to your site won't see those fonts unless the fonts are installed on the users' computers.

Graphics
Web pages incorporate two main types of formats: JPEGs (.jpg) and GIFs (.gifs)  In general, JPEGs are used for photographs or continuous tone images and GIFs are good for flat color graphic illustrations or clip art.

The larger the file size of the graphics you use, the slower your web page will load.  Graphics software (Adobe PhotoDeluxe, Adobe PhotoShop, Microsoft PhotoDraw, etc.) will allow you to resize graphics, change their resolution (see below), and convert them to the .jpg or .gif format.  

The resolution (pixels per inch) contributes significantly to the file size.  The higher the resolution, the better the printed quality of a graphic.  However, computers monitors are generally limited to 72 pixels per inch, so using a higher resolution for web graphics is a waste of file space!  Use graphics software to change the resolution to 72 pixels per inch.

"Borrowing" Graphics from the Internet
As you may know, it's very easy to save graphics from others' sites (right-mouse click and choose Save Picture As...)  However, it's often illegal.  Unless a web site gives explicit permission for use of graphics, you may not use them without violating copyright law.  If you find a graphic that you are desperate to use, try emailing the site's webmaster or another contact and request permission to use the graphic.  The Middle School web class has had great success with such requests.

There are many sites that promote "free" web graphics (see the resources section).  Go ahead and use the graphics.  However, occasionally, you may be asked to put a link to the page in order to give the site "credit" and free promotion.

Don't despair, you can use any of the Microsoft clipart on your pages and any of the graphics at ArtToday.  Check with the tech staff for the username and password for ArtToday.

Photos and Names of Students
To protect our students we do not ever post a picture of a student along with their full name.  If you are going to include pictures of students on your website, please refrain from using their names.  It is best to use group photos and no names.  If you must use a student name, never use the last name of the student. 

Quality Control/Reliability
Please check your pages for spelling and grammatical errors.  Also, periodically double-check the links on your page to confirm that they work.

The only thing worse than not having a web page is having a web page that is never updated.  Just kidding...kind of!  If you have a homework section on your page, but you haven't updated it for two months, visitors will become disenchanted with your work.  Start "small."  If you don't think you can commit to a regularly updated web page, don't design one with sections that need to be changed weekly!  Start with a general information page, and expand it as you become more comfortable and efficient.