Jan
10
2009
Launched Oregon Re-Bath with HTML5 and CSS Transitions, without IE6
We just celebrated the launch of the new Oregon Re-Bath website this last week. I’m proud of the work we did on it. This site marks the third site I’ve developed at Shepherd Interactive using HTML5 markup. HTML5 is the next version of HTML which standardizes the language of Web 2.0. Ben Brown (a designer here at Shepherd Interactive) did a great job on the graphic design, incorporating the Re-Bath franchise’s graphic elements into a unique design while at the same time allowing for the latest Web technologies to be employed. I worked to make the interface more engaging by adding in some animation. The navigation menus, home page elements, and the special offers sign-up are all animated using declarative CSS Transitions, which are supported natively by Safari 3 and Google Chrome. Firefox and Internet Explorer, however, do not yet support CSS Transitions. Because of this, I worked on implementing a subset of the specification so that the site could maintain a clean separation between HTML content, CSS presentation, and JavaScript behavior—this CSS Transitions via jQuery Animation source code is available under an open source license. It was a stretching experience to say the least, having to delve into CSS DOM internals and XBL/HTC bindings, but it’s rewarding to see the great results.
Read the rest of this entry »
