site features

I'd like to share some of the special features of this website which people might easily miss.

Validation: One of my goals for this site was to validate the code XHTML 1.0 strict in order to demonstrate my coding abilities. You can check for yourself that the pages of this site validate by clicking the W3C icon at the bottom left of each page.

CSS Image Gallery: On the Web Design, Fine Art and Photography pages you will see a CSS generated image gallery which I found at www.dynamicdrive.com/style/. An invisible span hides the enlargment for each thumbnail. When the user mouses over each thumbnail, the span becomes visible. This gallery doesn't use any scripting, works cross-browser, and validates XHTML 1.0 strict.

CSS Preloader: The home page loads the background image for the subsequent pages with a CSS preloader. This creates a seemless transition when the user clicks from home to a gallery page; the tree graphic is already cached. I found this CSS preloader online in several places. The background image simply has a class that makes it invisible on the home page. This does increase the download time of the home page, but since the graphic is the last element to load and it's invisible, the viewer is totally unaware of the added load time.

CSS/Image Navigation: The navigation I created for this site is a combination image nav and CSS nav. I wanted Optima for the font so I created graphics for the buttons. Rather than make three graphics for each button (default, hover, current) I used CSS to add borders around the graphics which change when the user mouses over them, and which indicates the current page.