Prototype 3: UNC Student Government

Overview

One of my original intentions coming into this project was to attempt a redesign of the UNC-CH website, which has frustrated me for four years now. I wanted to put it on par with (or better than) other major university websites that have a much clearer structure as well as a stronger visual appeal. Furthermore, my diagnostic tests indicated that the website has some accessibility issues. It is time for a change, but I doubted that any work I would do would actually be used, since I would only have a few weeks left at the University to push it through.

I had decided to do it anyways for demonstration purposes, but I was subsequently presented with the opportunity to work with Matt Tepper, the school's new student body president. He had discussed student organization websites with the UNC Disabilities Services coordinator, and when I mentioned my research, we became interested in working together to design the new student government site. The goal was to develop a fantastic site that will help bridge the gap between government and the student body as well as make a site that will be the benchmark for accessibility for other student organizations.

The plan was that I would help conceptualize the site and design the layout, and then I would pass the torch to two fellow CS majors -- Andrew Synowiez and Aamer Abbas -- to do the backend work after I graduate.

Process and Results

I approached this project as I would any other new project, but with a clear universal model from the outset. After I designed a rough model of the site in a graphics editor, I followed my own suggestions presented here and structured the content using strict XHTML, with a lot of foresight into the logical flow. I then created the style sheet needed to produce the desired visual effect. The result was pleasing, and we chose to go forward with it.

Accessible Site Prototype
Click to view new site
View Site Prototype: as designed using compliant XHTML, CSS, and accessibility techniques.
Screenshot: to see the site's presentation as rendered using CSS and XHTML.
Validation: Valid XHTML 1.0 Strict (0 errors)
Section 508: Bobby 508 Approved = 0 errors
WCAG: Bobby AAA Approved = 0 errors
Code Ratio: 3.17 = (6,228 / 1,959)

Source Code

Benefits and Tradeoffs: