Colophon

We launched this new iteration of the Ministry of Education website in April 2008. This revamp was more than merely cosmetic: we changed the entire technological underpinnings of the site, reorganised all our online content and put in a whole bunch of functionality. You’ll notice and use some of them immediately, while some others are made for more specific audiences. Some of the old legacy webpages are with us still, so this colophon applies for the majority of webpages that have been revamped.

Accessibility

A few legacy webpages stop us from boldly proclaiming the entire website compliant to all the latest accessibility guidelines, but we are committed to making our online content as accessible as possible. We believe everyone should be able to obtain the information they need from our website regardless of physical impairment or disability - it is a primary goal when designing our website that it works with modern assistive technologies.

Information Structure

The content on the previous iteration of our website centred itself around who owned the content. As different divisions within the Ministry wrote content for their own audiences we started to see a lot of duplication. This made maintenance hard for us. But more importantly, you were unable to find the information you needed because you weren’t familiar with the various branches within the Ministry, or which division wrote it.

Looking through the hundreds, if not thousands of webpages we had, we reorganised them into a more intuitive structure. For example, we put information on our education system inside /education, while information on careers within the Ministry in /careers. This also means readable web addresses. So where once you had to spell out URLs like index.htm?esf32f2f=323, you can now read it out in plain english.

Layout and Typography

We specifically wanted to avoid the sense of clutter that is commonly associated with governmental sites, so we instituted a strict 6-column grid for the layout of the website.

Rather than fixing the width of the website or forcing it to flow as large as the browser window, we made the layout elastic, and pegged its width to your font size. If you increased the size of your font in your browser, the layout of the site would grow accordingly. Readers who need the larger font sizes would still be able to browse the site in its proper proportions.

All body text are in Lucida Grande, while headers are in Trebuchet. The MOE Logo is set in Helvetica. When webpages are sent to the printer, they'll automatically be formatted in beautiful Georgia.

Technical Information

The site is written in structural XHTML. The homepage validates as XHTML 1.0 Strict, while content pages validate XHTML 1.0 Transitional. The presentational layer is controlled via CSS. The behaviour layer runs javascript on the Prototype Javascript Framework, with Scriptaculous for some visual effects.

Feedburner handles all our RSS needs.

The sliding spotlight section on the homepage runs glider.js by Bruno Bornsztein. The tab navigation sports a slightly modified version of Andrew Tetlaw’s Fabtabulous. Sortable Tables were made possible by the use of Stuart Langridge’s sorttable. A small script for inserting paragraph numbers via javascript was contributed by Divya Manian and Deepak Jois.

More technical notes about this site can be found on our webdev blog.

Credits

Over the course of the planning and revamping of the website we have been inspired by people more skilled and talented than us. Though this list is by no means exhaustive, these are some of the folks who have influenced the thinking behind the site you see today: