This site was designed as a teaching tool. I found the teaching goes both ways as I wrote it. Foregoing all my favorite hacks for simplicity's sake was like trying to tie my shoes with one hand. Anyway, I hope some students will glean a deeper understanding of web design through my work. This site has a little Javascript and a little CSS, hopefully just enough to make it interesting.

Have fun with it.

Marvin

There are two ways to teach web design. The first is to center the learning around high-level software like Microsoft Publisher. This is fine for cookie-cutter sites which really don't do much. The second way is for commercial sites and it is the hard way. You dive into the source code and force the browsers to do what you want. This is how this web site was designed.

Learning from this site:

1. Get a W3C compliant browser like Firefox or Netscape. Internet Explorer 6 is just too buggy to learn on. Most, but not all, bugs can be worked out after you have completed your alterations. Go to a site like http://www.positioniseverything.net for IE6 workarounds and hacks.
2. Download the entire site onto your local net. Then make another copy which you will play with. This way, you can destroy everything and the school will still have a working site! (Note: This site was made with links relative to the page so moving it around is a no brainer.)
3. Find a way to edit the pages. The notepad.exe that comes with Windows will work but I recommend jEdit which is available for download nearly anywhere. It uses colored text to help you distinguish comments from code at a glance. jEdit is written in Java and may cause the system to cough a fur ball occasionally, but it is only occasionally and is well worth installing. Don't worry about WYSIWYG editors, they don't work very well for a lot of reasons.
4. Print off leforsisd.js and leforsisd_screen.css for reference. You can also take a look at leforsisd_print.css, but its only active when printing.
5. Find some good books on HTML, CSS, and Javascript.
6. Play with it. This is how you learn web design. The good old, "I wonder what would happen if I..." makes the best web designers.

Frames:
Frames are ancient, bad, and needed on this site. Frames allow a splash of color and link back home even when the person writing the content has no idea how to do this. I no longer use frames because if you want to do frames right, they get complex. For example, what if a search engine hits on a page? You must put in Javascript code so the found page can re-frame itself.

Javascript:
I tried to keep it as simple as possible. The index page buttons are controlled with under 15 lines of pretty straight forward code. The contact us page has a whole bunch of repetition which converts a long string of numbers into a 'mailto' link.

Cascading Style Sheets:
CSS exists so you can control the appearance of an entire site with just a few keystrokes from one universal CSS page. So, click here and print to see what is going on.

Accessibility:
I have tried to avoid tables as much as is possible. The code for tables does not put data in a logical order. If you have cell phone Internet, tables will drive you nuts. Also, I have tried to make the text expandable for the visually impaired. (This is mainly using em units in CSS to work around an IE6 bug.)

Hacks:
I could have done all sorts of nifty stuff if I had hacked IE6 to fix some of its bugs. I avoided this because high-school students don't need to deal with the added complexity.
FYI: Microsoft has waited 4 years to upgrade IE6. This allowed bug fix hacks to proliferate the Internet. If Microsoft fixes the bugs in a new browser, the hacks for the old IE6 will cause the new browser to fail. Interesting dilemma.

Validation:
I rigged a Wizard of Oz method for checking your html. Just click the header 3 times and off you go to the W3C HTML validator. If the page is framed, you will go to the validator with the frameset and both pages all at once! Once you are there, be sure and check the CSS. To validate the Javascript, you just need to access Tools > Javascript Console in Firefox.