Extreme Makeover, typography edition

The Carsonified roadies have loaded their white Transit and braved the ferry across the sea to Northern Ireland. This week I’m joining the Future Of Web Design Tour in Belfast, presenting “How to Design in the Browser”. More on that later. But first, a one-hour workshop, “Extreme Makeover, Typography Edition”

Most sites would benefit from a typography makeover — a nip and tuck, a glyph graft or a pair of silicon smart quotes. In this non-invasive session, author, designer and self-confessed typography perfectionist Andy Clarke will take his scalpel to a site of your choice to demonstrate the fundamentals of type and practical ways that you can improve the look and readability of your content with better typography.

The audience suggested NI Direct — The official government website for Northern Ireland citizens. NI Direct is a relatively new site, launched in April, and by most standards it’s a nice piece of work. Of course that didn’t stop me from tightening its typography wrinkles. First the site’s home page.

NI Direct home page (before surgery)

Post surgery NI Direct home page

As one hour is not nearly enough time to cover every aspect of typography across the site, I also chose to makeover an article template as communicating written information is the main purpose of the site. Here I concentrated on:

• Adjusting to lay-out composition to optimise the measure
• Creating a better typographical hierarchy for headings
• Hanging lists, the quotation and punctuation
• Using the correct glyphs; em and en dashes and curly quotes

NI Direct article page (before surgery)

Post surgery NI Direct article page

You can download both the before and after Extreme Makeover NI Direct (ZIP 645Kb).

I hope the audience enjoyed the session and think that NI Direct looks younger, thinner and more radiant after it’s makeover.