How ESPN.com’s redesign got it right

Posted in: Case Studies, Design, by: John Duncan

Jan 08, 2009
11:52 AM

BY MARIO GARCIA JR
I must admit most of the time that I look at a redesigned web site it’s because either I did it myself, a friend did it and has asked me to take a look, or I’m reading about it on one of the industry blogs. Occasionally there’s the high profile web site redesign. Occasionally like maybe once a decade (see craigslist, ebay, amazon). And it’s not until this week that I find myself looking at a redesigned site with a slightly different eye.

Early Monday morning, around 12:34 am, I was introduced to ESPN.com’s newly redesigned site. At first it wasn’t as obvious, but for a small Ford F-150 racing across the screen and skidding along a muddy hole, spraying dirt all over an ESPN anchor who was on a video screen on the site, seemingly having nothing to do with the animated advertisement. Very clever way to get me to pay attention to the guy telling they’re introducing the new site...and make some good advertising dollars at the same time. And I think it’s even smarter that it was a one-time deal. That would get old if it happen every time I went to my favorite sports site.

So what’s different here, besides a high profile site making changes? The difference is that this is a site I visit religiously every day. This is a site I come to not as a news designer but a news consumer. For the first time, I get to experience a redesign like the many readers of the sites I have redesigned experience theirs. It’s been truly enlightening. For starters I actually found myself quite skeptical at first, questioning why they would even redesign in the first place. As a news designer I could definitely find fault with the old espn.com, but as a news consumer I knew where everything was, I was used to it - and for the first five minutes this “change” was a bit unsettling.

But then what naturally happened is what I hope happens every time someone is confronted with change - I got over the fact that it looked different and started acquainting myself with the “new” site. And what I found was improvement the way it should have happened. The things ESPN.com got right:

DON’T FREAK OUT YOUR USERS

ESPN is a high traffic, loyal audience site. To make drastic changes, no matter how much they improved the site, ran the risk of turning off a large percentage of their users merely because it was not what they had grown accustomed to. Remember, we are all creatures of habit.

The redesign does not necessarily change where the main standing items are on the page, making the transition to the new design easier for users and enhancing the improvements that were made to those main elements.

DEBUNK THE “BUSY IS GOOD” MYTH

I actually have some news clients that tell me they want their site to look busy so readers can see the depth of information they have. So clutter the site with all sorts of information, making things hard to find, so that you’ll be perceived as a serious news organization? Does that make any sense? There’s no doubt that ESPN has an incredible depth of information, from college to pro to outdoors to video. There’s also no doubt that the new design is more concerned with getting users through the content rather than flexing the ESPN.com muscles (even the logo is smaller).

Overall, there’s less of that “so much to see and read, where do I start?” feeling you got from the old espn.com site.  Top stories and top videos were incorporated into the main element of the homepage with a simple tabbing feature. One of the annoying things of the old site was that the video on the right part of the page was always competing with the main story creating a sort of hierarchy problem. Not to mention that since it ran automatically it was a bit of a distraction as you were scanning headlines. ESPN, because of it’s television presence, can tell stories in video as much as in words so it makes sense that these two types of presentation options share the main part of the site.

Perhaps the best part of the redesign is visual segmentation of the bottom of the page.  On the old site, the bottom of the homepage was simply a mess. The result of a site that kept growing and space had to be found for all the new features. I’m sure as a user I missed a lot of good content on the bottom part of the page simply because the visual chaos prevented me from being able to scan it all quickly. But all that’s changed on the new site. The designers and editors of ESPN have cleverly given priority to the parts of the site they know their users like. For example, no offense to any other Page 2 contributor, but Bill Simmons, the sports guy IS Page 2.  Forget about cycling him with all the other page 2 materials, make it easy to find his stuff. And that’s just what the redesign has done. Now Bill has his place, not among a visual clutter of other things, but among 5 other elements on the bottom of the page. Five! And that’s it. This is a guess but on the other site it felt more like 50 other elements. Even if that’s not accurate that’s how it felt.

FIND ONCE PLACE TO “STUFF” EVERYTHING ELSE

Every site that has tons of information has the same problem—items that need to be there but don’t necessarily fit anywhere else like secondary stories, promos, aging stories, other features etc. The stuff you “may” be interested in. Many sites use the bottom of the homepage to do just this, dump it all there. And the old ESPN was the same. But now they’ve created ONE element at the bottom of the page and labeled “ESPN.com At A Glance” where you can quickly scan the other stories and features on the site. Clean, organized and it totally works.

NAVIGATE BY TYPE OF CONTENT NOT TOPIC

Without any significant research to back this up I’ve always believed, and still do, that as users we’re more prone to navigate contextually rather than topically. In other words, I’m more prone to click on headline like “Drama in Dallas heats up” than I am to click on say “SPORTS” or ‘NFL” in the main nav bar. Recently though, what I’m realizing is that while people do navigate more contextually there is still a use for navigation if it’s organized by type of content rather than topic. And it makes it easy to organize a complex information site this way. The new ESPN.com has done just that. Instead of navigating through the various sports, not to mention college or pro, in the top tier of navigation, the new site has introduced a simplified navigation structure where you can navigate by the type of content. While the old ESPN site had over 14 main nav items the new one has seven (7). Within those seven items is a sub navigation system, but now it’s easier and faster to get to those sub nav items by deciding what sort of content you want, All Sports? Columns? Fantasy Sports? Video?

The ESPN.com redesign works because my guess is they paid very good attention to how the users used their old site, how they navigated, what they loved, what didn’t work. Then they did a very good inventory of what they had and organized it in a way they were confident would make the overall user experience better. Would I still go to ESPN.com every day even if they didn’t redesign? Absolutely. I doubt they were losing audience to other sports sites, but like Formula 1 champion Michael Schumacher once said when asked if he ever relaxes when he looks in the rear view mirror during a race and sees he’s comfortably ahead, “I never look in the rear view mirror. I just go.” The new ESPN.com is not waiting for competitors to catch up. Instead, one of my favorite sites is making a case for not being afraid of change for the better even when your numbers tell you it’s not necessary.