Designing Better University News Pages
College and University websites usually feature a smattering of news items on their homepage, with an additional link that takes visitors to a page dedicated entirely to news. A future project of our web services team will be to radically improve our campus news page.
As a web designer at a University, I’m housed in the Office of Communications. While I’m tasked with maintaining and creating design patterns as well as look and feel for web, a newsroom atmosphere exists in a communications office that inevitably keeps me involved with publishing/formatting campus news and events.
Content management tools have made a much simpler job of posting news items and articles, and soon I won’t be required to assist in this process at all. Nonetheless, sometimes I feel more like a web designer for a news organization, as apposed to a college. It’s interesting work though, news, …so its ok. Who knows, maybe someday I’ll be a rockstar news designer like Khoi Vinh.
There are several challenges to creating a dedicated news page. And I won’t pretend to be an expert. If I run across a great news page at a college website, I’ll bookmark it, and take notes. It also helps me to examine design trends at other news organizations.
Three GREAT articles about design for online news have come my way recently, and I’d like to share them.
Granted, larger news organizations have a great deal more content to offer, which makes decisions about design even more difficult. But that doesn’t mean that there aren’t valuable lessons to be I can learn from the big guys.
New Media Meets Old: A Look at Redesigned Mainstream News Sites
…a great article that takes an in depth look at trends in online news design.
“I thought it might be interesting to compare three big media sites that have launched new versions of their web news properties in 2007: CNN (redesigned this weekend), USA Today (redesigned in March), and AOL News (redesigned last week). I’ll look at the different approaches each news outlet took, and what cues they took from web 2.0.”
Quiet Structure
…from Andy Rutledge is another great read.
“One of the basic, overriding elements featured in CNN’s new website design and layout is something I like to call quiet structure. Quiet structure is achieved when you de–emphasize the structural elements; the containing boxes, structural lines, bullets, structural color elements, etc… and bring a rhythmical consistency to the layout. The result is that the content becomes more conspicuous and the overall clarity of presentation is greatly enhanced.”
“For example, USA Today chooses to mix and match image/text pairs’ orientation. Some are paired horizontally while others are paired vertically. This might not be a problem, except that there are many image/text pairs in any given section of the page, so the issue is exacerbated. Furthermore, there are spatial issues that detract from the presentation’s clarity, as in the image below.”
Quiet Structure
“In order to help you get a better sense of the overall visual volume of the structures of our two example sites, compare the structural layouts of the sites in the images below – without content.”
as compared to:
“Notice how USA Today’s high–contrast, textured, varied–width structure is far more conspicuous than CNN’s low–contrast, greatly reduced, consistently spaced structure. USA Today’s structure begins to compete with the content while CNN’s just pretty much gets out of the way of the content.”
Behind the scenes at the CNN.com relaunch
…is an interesting short article that picks the brains of the developers behind the curtain.
“CNN.com unveiled its redesign over the weekend, incorporating a cleaner look, a better way of linking different media on the same story, and some slick Web 2.0 goodness (including in-page video and user commenting).”
“It’s a radical do-over for one of the most highly-trafficked sites on the Web. We asked the production teams (in London, Atlanta and Hong Kong) how they approached the project.”
All three articles are a great place to start for anyone considering a news page redesign. I’ll be referring back to them a great deal in the coming weeks.
I’d also like to share a few campus news sites that can be appreciated for their design:
University of Florida News
Biola University News
Cornell Chronicle Online
Notre Dame College of Arts and Letters: News
Stanford News Service
