Technology Inservice: 
Classroom Web Pages

 

Session : The KISS Rule -- "Keep it simple, Stupid!"

Layout and design is a very subjective topic, but the important thing to remember is to HAVE a layout...as opposed to just putting information on the page.

Some Main Points to Consider

  1. Split your information into logical sections.

  2. Make sure your starting page is attractive and well laid out.

  3. Have a consistent theme throughout the entire site.  This helps to create and maintain a visual unity.  Business do this with logos, letterheads, business cards, etc.

  4. Use colors, styles and fonts that complement each other. 

  5. Symmetry help create a conservative feel, but too much can also be boring!  Asymmetric elements can generate a feeling of energy and excitement, but also a sense of disorganization and confusion.  Strive for a good balance!

  6. Contrast of colors and sizes helps establish a focus point and draws attention to your important points.

YIKES!!  I hope you will 
have more style than
this page!

Heard a good joke lately?


Go here and have a good laugh! 
 

 

 

 

 

Elements of Web Design

Text

  • Break long segments of text into shorter sections.  Typically, visitors do not like to read long passages of text on the screen.
  • Use hyperlinks when appropriate.
  • Some ideas to include in your page:
    • biographies
    • hobbies
    • resumes
    • links to other web sites
    • calendar of events
    • samples of student work (poems, essays, reports)
    • survey results
  • Keep it relevant and updated!

Photographs and Graphics

  • Photographs may not include names of students.
  • Students may not be identified.
  • Please do not use copyrighted material!
  • Make sure you have permission from the parents to put their child's picture on the web.
  • Photographs will be optimized for smaller file sizes.

 

 

This is an example of a very overloaded web page with a very mixed "style."  Nothing matches, not the colors, not the fonts, not the graphics.  It also takes 50 seconds to load (at 28.8)

 

Questions and Answers

Let’s Get Started!

I.  Make a new Folder: “My Web Page”

A.  Choose a Color Scheme
B.  Choose a Background
C.  Experiment with Link Colors

1.  Link Color
2.  Hover Color
3.  Active Color
4.  Visited Link Color

II.  Visit websites for ideas

A.  “Save Picture As”
B.  Copy and Paste

1.  URL’s
2.  Text