Design decisions and highlights of Scripps’ newest local news site
Earlier this week, the team at Scripps Interactive Newspaper Group launched a major newspaper website overhaul for the Evansville Courier & Press in Evansville, IN. This project has been brewing for almost a year, and has been a full-time responsibility for some of us for more than six months. Here are some of my favorite changes for readers:
The new courierpress.com homepage. Hover to see the old version.
Improved scanability
The old site, while framed by a strong structure, was difficult to scan for content. The font was small, and headlines lacked necessary spacing to pace a reader from one to another. The column arrangement of the homepage forced a reader’s eyes to scan on both x and y axes. These two factors made readers work harder to locate valuable content.
The new site uses fonts sized appropriately for their line lengths, and headlines are spaced with room to breathe. There is no doubt where one headline ends, and another begins. Wherever possible, we’ve reduced the number of columns on a page. On the homepage, once a reader has scrolled past the top stories he will find related chunks of content spanning the entire width of the page. We saw this convention first on MSNBC and decided it would keep readers’ eyes moving in one direction down the page in search of content of interest.
Improved discoverability
The old site linked to related/popular content on story pages only from the sidebar and in a small bucket atop each story. Links atop the story mean readers aren’t yet ready to click away to other stories, and readers may never change focus from the main content area to scan sidebar links.
The new site presents readers with links to related content at the end of each story - where readers have finished with one task and are ready to be guided to another.
Other highlights
- Instead of only showing one thumbnail for each gallery, the new photo gallery list shows 6 thumbnails for each, with a link to a full gallery that now loads within the standard site layout instead of the old pop up window. All photos and videos are now presented on a black background to make the imagery pop.
- Forecasts atop the weather page are just sexy.
- Searching can now be done across multiple content types with ease.
- Local band pages, a very neglected section of the old site, feel like first-class citizens in the new site. Same goes for polls.
- Event listings are now filtered in place, and it’s wonderfully easy to jump from day to day.
- Restaurant listings can be quickly browsed by cuisine or neighborhood, with maps only a click away.
- The homepage “poster”, a set of rotating images/headlines to link to top content, is no longer assembled in Flash. Thanks to jQuery, readers can finally open these links in new tabs, which Flash had prevented in the past. jQuery is used all over the site to enhance functionality and interactivity.
These design changes would not have been possible were it not for a huge effort by our backend developers. Like all our sites at Scripps, courierpress.com is built on top of Ellington. But in the years since we purchased our license, our development team has transformed the original codebase to make some really cool stuff happen despite limitations of its Django .90 framework. Think of it as Ellington’s awesome, mutated clone.
Ultimately, my favorite part of the new site is how easy it’s going to make future development. Scripps’ previous round of sites gave each newspaper property a full set of templates on which to build. This meant whenever we created new feature or fixed broken functionality, we had to spend days, sometimes weeks rolling the change out to each site. Courierpress.com is the first of our new sites built on a shared set of templates for common functionality. In the coming months, we’ll be moving all our properties onto this platform, where improvements we make for one site will benefit all sites without duplicate effort. This means less time duplicating changes across our network and more time building useful stuff.
I think Evansville has itself a pretty sweet site, and I’m proud to have been a part of its creation. What do you think?
Discussion