CS015 Website Redesign

CS015 website ScreenshotThis semester I’m a teaching assistant for the CS015 course at Brown that I wrote about half a year ago. My main responsibility this summer has been revamping the course website. If you are reading this blog post any time before the summer of 2010, you can probably see the new layout live. In the case that I’m communicating with you over a year into the future you can see a screenshot.

My brief was to make a website that would fit with the course’s theme (Yes the course has a theme. Read the aforementioned blog post), Star Trek. I decided to base the website off the Star Trek universe’s LCARS computer systems. This was by no means an original take on making a Star Trek tribute layout – lots of fan sites have done similar things – but it is certainly recognizable.

I cherry picked other layout aspects quite liberally from different time points in the Star Trek series. The header text uses the typeface from The Original Series. LCARS itself only features in episodes and movies placed chronologically after TNG. The ship shown is the Enterprise of the 2009 Star Trek relaunch.

I ran into the CSS column issue when making the layout. The dashed line under the navigation buttons was always intended to stretch to the bottom of the layout no matter how long the content was. I originally made this work with positioniseverything’s CSS columns hack but later realized that there would be anchored links in the content presented in the layout. The anchored links caused the layout to break in Firefox, so I was forced to revert to javascripting the same effect. However the javascript I (found via google and) used to do it doesn’t work in some versions of IE. I obviously need to become proficient with a JQuery or another good javascript library.

The layout also uses conditional comments and the ie7-js script to mitigate issues with IE6, in particular the use of a png image with an alpha layer for the Enterprise in the top left.

In closing… if you are reading this and are an undergraduate at Brown, take the course this year! If you tell me you’ve read this post, I’ll give you extra special help. This statement is probably a lie.

One thought on “CS015 Website Redesign

  1. Pingback: zethrae.us/blog - CS15 TAing Retrospective

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>