Evolution of a Simple Home Page

Look at each version, with its page source.
You will also see that once an image has been loaded for one page, the next time your browser asks for the image it will load much faster.
Recently down-loaded files are saved by the browser.
Re-using images (for logos and for navigation) from one page on other pages saves time and also gives your pages a more consistent feel.

1. This version was taken from www.simmons.edu/~menzin
   You can tell it was written with a converter or other program because of all the extra garbage in the code.
   Oops! I saved the file but I forgot to save the nice little bullet gif (gif3.gif in the html code) so there are blank boxes where the bullets should go.
2. I got the bullets back.
   Actually, I chose cuter ones, too.
   I also put some spacing into the html code so that a mere human could read it.
3. Clean it up!
   I got rid of the extra garbage from the converter and also corrected my email address.
   Notice that the bullets (smiley.gif's) are outside the anchor tags. When you run your browser over them you can see that they are not active (but the underlined text is.)
4. Now the icons are active.
   Ive put the icons inside the anchor tags. Run your browser over them and you'll see that the address you link to appears at the bottom of the page.
   I've also changed the particular icon so that you can tell this version apart from the earlier ones.
5. The mailto is added.
   Look near the bottom of the page!
6. Let's add a photo
   Of course, I've used a table to do the layout. I want to keep the headline centered.
7. Tidy the text!
   The text looked pretty dumb when it wasn't left justified.
   The photo, however, is still in the wrong place.
8. Center the photo.
   Also try adding some cellpadding. This is better but the photo should be further to the right.
9. Okay!!!
   First of all I've right justified the photo.
   I've also put the ALT tag in on the image. Finally I've made the table only 85% of the page width (this requires some diddling) to get a nice white margin, and I've increased the cell padding.
   It's not great art, but it's certainly acceptable and professional.
   I could spend time getting rid of the borders around the icons, but I decided it wasn't worth the time. Remember - you need to know when to stop. Now it's time to go onto the next task on the giant "to-do" list in the sky.