Galleries: Web Design

"Documents Through Time" Website

Evans Christian Academy website
Click to view the website in a new window.



This website was made for Danielle Lawson's LCC 3401 Technical Communications class at Georgia Tech. For this group project, I was responsible for the website's design, graphics, and coding. Analyses and other content was made by Andrew Crowe, Aziel Ferguson, Christopher Logan, and myself.

Site Design and Coding:

I manually coded this website using HTML, CSS, and JavaScript. It can be properly viewed in all modern browsers and has been verified in Safari (Mac, versions 1.3.2 and 3), Firefox 3 (Mac and Windows), and Internet Explorer 7. It cannot be viewed properly in Internet Explorer 6, primarily due to IE 6's lack of support for the position: fixed CSS element. Unlike my main portfolio site, the use of fixed positioning does not cause problems when viewed in MobileSafari (iPhone/iPod Touch) because the navbar simply remains a the top of the screen.

A single CSS file is used for all pages of the site in order to facilitate editing. Only two CSS elements were changed for different pages: the body background and the gradient background of the main content area. These were changed with a few lines of CSS in the header, just following the external style sheet link. The use of the CSS position: fixed element allows the creation of a universal header and menu that appears fixed to the top of every page. Page content scrolls smoothly underneath the header.

JavaScript is used on the individual time period pages. All four sections of each time period are in the same HTML document, and the CSS display: none element is used to hide the three sections currently not being viewed. Javascript embedded in the HTML switches each section's visibility on or off based on which section link has been clicked. For a longer explanation and more examples, visit Willmaster.com's tutorial.






All site layout, graphics, and content © 2007 Jonathan Sheppard.     Contact: shrakner2140@yahoo.com
This site is best viewed with Firefox or Safari.