If you’ve kept up to date with our blogs then you’ll know that Alex and myself have, over the past few months, been slowly working towards a unified design for all of the University’s online services. This is the Common Web Design (or CWD for short), and provides the underlying page structure, semantic layout, design, typography, colours, UI and UX widgets and more for the entirety of our online services provision.
A few people have asked, and quite rightly, what was wrong with the old designs. It’s a sensible question, after all there’s no point wasting effort fixing something which isn’t broken. However, the answer is not that the old designs were broken or wrong, but that a new design could offer a lot more.
Unification
Previously each of the University’s online services were branded more or less as they came out of the box, with possibly a Minerva logo thrown in for good measure. In general the UX was hopelessly inconsistent, increasing the amount of training needed to use each service. What the CWD provides is a single way of interacting with things: the menu is always in the same place, help links live in the same place, the search box behaves the same way, links, buttons, text and headings all look the same across multiple sites.
Accessibility
The new web design has accessibility built in from the ground up, making full use of the semantic tagging available in HTML5 to describe a webpage in a way which a computer can understand, making the job of assistive technologies such as screen readers a lot easier. We’ve done away with old methods such as using tables for layout which confused screen readers, we’ve expanded our use of descriptive data in images and embedded video to provide alternative content and we’re constantly reviewing old pages to ensure they meet best practice.
Speed
We’ve focussed a lot on speed of the page itself, optimising our CSS styles and JavaScript to let the browser finish rendering the page as quickly as possible. We’ve even fine-tuned caching to maximise the reuse of material across multiple sites, meaning that as soon as you visit one Lincoln website you’ve downloaded a lot of the relevant material for every other website.
Alongside this we’ve done our best to implement the design taking Fitts’s and Hick’s laws into account. These dictate how quickly a user can get something done, based on the number of choices available and the size of the buttons which actually perform the action. In short we’ve made sure that we’ve taken into account the speed of actually using a site, and we’ve tried to make using our services as smooth as possible.
Visual Appeal
Everybody loves a bit of eye candy, and visually appealing websites make people feel less intimidated. We’ve literally argued over the positioning of some elements down to the pixel, along with trying countless variations of typography to make sites easier on the eye. Combined with the use of large graphics, stylish UI elements, colour schemes and more we’ve done our best to add a bit of sparkle to what used to be relatively drab, corporate-looking pages.
Futureproofing
All our new websites are built to the latest web standards, making use of proven technology to offer a robust service whilst at the same time using the newest features of browsers to improve the experience. We’re using well-supported frameworks to build our own services on top of, helping to smooth out the differences between browsers to ensure that even users as far back as IE6 can use our services (although IE6 support is on the way out. If you’re using IE6 you should update your browser right now. As in stop reading this and go do it. If you can’t, call your IT department every day until they give in and update).