Every now and then, when things get slow at work, I look for an existing site on the server that needs its code updated and rebuild it. Same design, with a few minor or largely hidden changes, but using minimal HTML5 and lots of CSS. Last week, the Village of Riverwoods, Illinois got picked out for an under-the-hood makeover.
A couple of pages were enhanced with collapsible sections, while one noticeably absent page, the news archive, was created and added. Old jQuery code was thrown away and recreated. Table-based layouts were replaced with modern CSS and HTML5, making it much easier to edit content and create new pages. A mobile stylesheet was quietly added and alternate navigation was developed for mobile use. And as requested, IE7 compatibility was maintained as much as possible.
For various reasons, I’d never gotten around to using the HTML5 Boilerplate template before, so I decided to use it this time around. Switching from the classic CSS Reset to Normalize.css took a little getting used to, but probably made debugging a lot easier. This was also the first time I’d used the
data-driven jQuery Cycle 2 plugin instead of the original jQuery Cycle, so I was glad to find my fears of re-learning its quirks were unfounded.