Designer's Note: Designing a New Torontoist
Torontoist has been acquired by Daily Hive Toronto - Your City. Now. Click here to learn more.

Torontoist

47 Comments

news

Designer’s Note: Designing a New Torontoist

In our efforts to class up the joint, we made some significant design changes. Allow us to explain the method to our madness.

Let’s be honest: the old Torontoist has been looking a little creaky for a long time now. The pale blue design was based on a 2006 template created by former Torontoist parent Gothamist, with a few extras tacked on over the years. A site revamp has been near the top of our wish list for ages.

We knew that the most important element of the new Torontoist had to be better readability. We’ve moved the articles to the left side of the page, cut the clutter, and chosen an attractive embedded web font (Open Sans, created by Steve Matteson). We also added “deks”—the summary beneath a headline common in magazines—to help our readers decide at a glance if an article interests them. Bylines have also been shifted to the top of the article so it’s easier to identify the work of your favourite Torontoist scribe, photographer, or illustrator—and yes, we have separate bylines for our visual staff now. Well-proportioned whitespace is intended to keep distractions at a minimum as you read.

We want to do a better job keeping you informed, so we’ve added an “Editor’s Picks” section in the right column where we highlight stories we think you shouldn’t miss. We’ve also added the option to keep a feature story or an interesting article from our archives at the top of the page. If an emergency or important breaking news is happening, you will see it immediately in a banner across the top, including quick links to crucial information. We’ve even made TTC service alerts immediately accessible in the right column.

Photo galleries will now appear in a separate interface, which makes the photos easier to navigate and presents them in a more appealing way, with reduced extraneous clutter. The standalone slideshows are now directly linkable, and we’ve added a full-screen option so that as we create new galleries we can use images that are much larger.

One of the first elements you undoubtedly noticed was also the most fun to design: the whimsical new logo featuring iconic images of Toronto. We’ve got about twenty different versions in rotation, with more to come—including ones for special events, like Pride, Canada Day, Woofstock, or TIFF.

Assembling the new Torontoist was like putting together a puzzle, with some pieces coming from the business side (“What spaces do we need to reserve for ads?”), some from our staff (“We still want a reverse chronological publishing format”), and some from both (“How can we get people reading more of our articles?”). Plus, it needed to be readable and look good across browsers and platforms, and we wanted to strip down any bells and whistles—so no weird proprietary scrolling or annoying rollover animations. Special thanks go to Michelle Darwin for meticulously translating pie-in-the-sky Photoshop mockups into proper CSS.

On a technical note, we’ve also switched CMS platforms from Movable Type to WordPress. Articles from the old Torontoist will have been automatically reformatted and will be missing some of the new elements (like deks), so you may notice some wonkiness here and there in the appearance of older posts.

As so many website redesigns have proven, humans are resistant to change and sometimes things take a step back in usability, so we do expect to hear a lot from you about the new Torontoist. When it comes to navigating the site and reading articles, we’ve attempted to keep things familiar, simple, and useful—so you can easily read up on what you need to know and get over to the water cooler to talk about it. Email us with your thoughts, or post them in the comments below.

Comments