Jul 14 2010

Improving the BBC News Redesign

By Monji in General3 Comments

If you haven’t been to the BBC News page lately, check it out! They’ve completely revamped the site, changing the header, typography and element positioning among other things. While I like the changes overall, I would have done a few things slightly differently to make the site more user friendly.

The Header

The overall layout of the header is perfect – I have only a few minor color and typographical tweaks that I think would enhance the user experience.

Current:

My Version:

Differences

Most of my changes for the site take place here – I reduced the overall height of the header by about 10 pixels, removed some of the padding around the top navigation bar and grouped all the top links together. The font size of the current date and last updated timestamp were increased, and I also changed the color of the main navigation bar – lighter background helps add a bit of contrast and slightly improves readability when it comes to fonts that small. I also added a slight border radius to most of the square shapes (3px), just to make it feel a little smoother.

The Main Homepage

Like the header, most of the content is placed pretty well – my only gripe was with each featured element stacked on top of one another.

Current:

My Version:

Differences

I didn’t do much here, really, just added bullet icons to make the lists more noticeable and placed the ‘Also in the news’ and ‘Sports’ sections next to each other. This last move allowed an additional story and link to both sections without changing the overall height of the page.

Article Page

Like the main homepage, the article page feels like it could use a little tweaking in terms of content placement. The first thing I noticed about the layout was the huge gutter to the right of the content – while I’m not sure why they chose to have it, I left it as is in my redesign.

Current:

My Version:

Differences

The only real changes are in the footer of the article – instead of having a ton of stacked elements, I widened the entire section and made two columns instead. It just feels like a waste of space otherwise and forces the reader to scroll heavily to find related information. The column setup also puts more focus on the Google ads, possibly increasing conversions/click-throughs (would take some A/B testing to confirm).

Conclusion

This was just a bit of a design exercise for me, taking a popular homepage and trying to come up with changes that could help improve usability and overall user experience. My suggestions are far from perfect and I’m sure the BBC staff has excellent reasons for each of their design choices, so take my suggestions lightly.

Please post feedback on my version and the actual site – are my changes completely unnecessary? Do you have any suggestions of your own? If you’re in the mood, try making a mockup of your own and post it in the forum!