This is a personal page designed for my friends and family. When I am away at school, this page will make it easier for my friends to find out what is going on in my life.
The main communication features are a journal and a notice board, both located prominently on the main page. The notice board has a bright background so that it will stick out from the rest of the content. It will be for important announcements or significant events. The navigation bar on the main page allows users to traverse my site as well as link to my friends' pages and Livejournals. This makes it easier for people who read multiple journals and go from one to the next.
The page also features a Gallery, which will have multiple subpages for separate subjects (i.e. Smith photos, Alaska photos). The content on the primary gallery page is an interactive display of a few photos with questions that the user can guess the answers to. Links under the photos lead to alert boxes announcing the correct answer. My gallery page also links to galleries on my friends' homepages.
The Media Quiz is just a fun test for my friends, who probably think they know what my favorite songs/movies are, and are probably wrong.
This page has one CSS file. In Project 2 I took more advantage of classes than in Project 1, where I primarily used ids. I still needed ids in this project, in order to arrange divs on different pages.
Because this is my own, fun personal site, I used a black background with bright colors. The user can change the color and font preferences via cookies from the main page.
One difficult style issue I had was getting the navigation bar rollovers to change color when the cookies are set. As of now, I have avoided my trouble writing the variables by changing the color scheme of the navigation bar (the rollover color is constant).
Forms: I used forms to make my interactive Media Quiz. Users can look at lists of eleven songs, tv shows, movies and bands, and decide which entry does not belong among my top ten favorites. The form data is then processed and the user can see their Quiz Results. I built the form and process page by reconfiguring an example from Nick Howe's page.
Cookies: I used cookies to allow color and font changes by adapting material from Nick Howe's page. Note: The font does not change within the navigation bar. I decided it was not the significant text of the page and did not set aside time to write that in.
Interaction: The form and cookie elements make up the primary interaction, however on the Gallery Page I also created a four image display where users can guess what the pictures represent and click a link for the answer. It is just another way to get my friends and family involved in and aware of my recent experiences!
User feedback: The navigation bar (built off of Nick Howe's) has rollovers with color changes to let the user know that the links are clickable and active.
Elements from Project 1/Other: My page uses a style sheet, navigation bar, div block formatting, and a primary image for the main page. I used PHP to repeat cookie/javascript material on multiple pages, to avoid copying/pasting material and to make revisions more efficient. I also used a PHP document for my journal and announcement board, so that when I update those items frequently I will not have to sift through all the content of the main page to find what I need to change.