.comment-link {margin-left:.6em;}

Tuesday, April 01, 2008

The BBC News redesign disaster

Update: The BBC "responds" to the criticism so far, but actually fails to answer a single point made in the 1,400+ complaints now left on the BBC blogs.

Something very strange is happening in the BBC webdesign department. Usability rules and user experience testing seems to have been tossed out the window in a head-long rush to be new. The revamped BBC News website has so many problems it's hard to know where to begin. However a flavour of its reception can be gained from the comments to the blog announcement, which after just 30 hours has seen over 1,000 complaints about the site! That's despite the problems with commenting to BBC blogs due to their being locked into an ancient version of Movable Type, meaning that it takes minutes for a comment to finish posting, if at all.

Other BBC blogs, such as the BBC Internet blog announcement, have seen their comments turned off to hide from the deluge. Nick Reynolds says, in the comments below, that this was to herd the comments into one place, although oddly now there are at least three BBC blog posts on the topic with comments enabled. Make of that what you will...

So what's so bad about the site? Let's start with the mark-up. A w3c validation check shows 347 errors in the "XHTL 1.0" code. Three hundred and forty-seven! That must be some kind of record. Oddly, setting the validator to check against HMTL 4.01 shows only 81 errors. So it seems the BBC coders don't know the first thing about compliant code, or even which doctype to use.

(Update 2 April Martin Belam explains that the legacy CMS the BBC use could well be the cause of such bad mark-up.)

Their CSS fares better -- only five errors and 275 warnings against CSS 2.1. In fact their CSS performance is remarkably good considering the site has 54 kb of code spread over 8 CSS files.

(In total there are 140 seperate objects on the page, including another 54 kb of external javascript in ten files.)

More coding oddities include using pixels to specifiy font sizes rather than the standard ems, that a serif font is specified after verdana making the site rather ugly on many Linux systems, and the fact when the site first launched it didn't work at all in Firefox (tiny text), which opens questions about the BBC's testing procedures. (In fact the site is also broken on the iPhone.)

Other design changes seem odd. The new site is 1024px wide, but has 15% less content (primarily a reduction in the number of stories linked to from the main page, cutting links in the Around the World, UK, and Sections from two to one). This forces the user to scroll and eye-scan over a much larger distance in order to access less content. The space is taken up by increased padding around the remaining elements. I can't find a single design guideline that mandates that.

Despite ostensibly being based on a grid (pdf), very little on the page lines up. The left column, including the banners, features five different horizontal alignments (and six styles of text, including text-as-images). Included in that is the main BBC logo and the large BBC News logo immediately below -- they don't line up.

Vertically, the main and right columns fail to align too, with jumps in the horizontal dividers.

(The right column also features links to videos in the original Real Media format, despite claims that the site now uses embedded Flash video.)

Very little bolding is used for the headers, which for the minor ones depend on ALLCAPS. How very '90s. The reduced contrast and lack of background-highlighting makes scanning for seperate sections much more laborious.

Perhaps the strangest design choice though is the use of grey text, rather than black, on the white background. The reduced contrast makes the site harder on the eye and is one of the leading complaints to the blog announcement. To say that this goes against everything usability stands for is an understatement -- a triumph of form over function.

However the grey-on-white text must vie against the new pan-BBC header bar -- simply a black rectangle with two links and a search box. The search box doesn't indicate whether it's a site search or a web search -- maybe it's just pot luck? Originally there used to be links to the major BBC website sections such as News, TV, and Radio, but they've been swept away. Presumeably the BBC believes that users will instead type into the search box to access these sites, much as many web users now use Google as their "bookmarking" system. Hard to see how this increases site usability.

Overall the site is a disaster in both design and usability. During the recent BBC homepage redesign it was boasted that the site had been developed and deployed in only three months with a minimum of testing and usability studies. This trend of slap-dash, rapid-development seems to have spread throughout BBC webdesign.

Compare all this to their last redesign in 2003. Everything lines up. Consisent fonts are used throughout. The aim of the design was to show more information with less scrolling. Pretty much perfect! (For a flavour of the quite positive reactions that redesign brought, read this thread on Webmaster World.)

Perhaps the BBC have been drinking too much of the web 2.0 kool-aid. Agile programming, release early and often etc. Such memes might suit small, young companies such as 37signals, but not heavyweight players. How often has Google changed its homepage in the last ten years? Even much younger, fully "2.0" sites such as Facebook have stayed away from rushed redesigns.

The most ironic part of the whole debacle is that, in the original blog announcement, the BBC confesses that the majority of users they surveyed before the changes were made had said "leave the site alone"!

AddThis Social Bookmark Button

I am the editor of the BBC Internet Blog.

I did not turn comments off on the entry pointing to Steve Herrmann's blog post on the Editors Blog in order to avoid criticism - as implied in this post.

If I am cross posting (i.e. pointing to a full blog post on a different BBC blog) I always turn comments off. This is so all comments/conversations happen on one post not on different copies of that post, thereby giving people a better/less confusing user journey.

Nick Reynolds (editor, BBC Internet Blog)
Maybe you should look a little closer to home before you criticise a redesign that is clearly a huge task, and, by its own admission, unfinished.

For example- your very own blog is running in quirks mode, and light grey on a pale yellow sidebar isn't exactly what the 'guidelines' would call usable.

There's a thing to be said for being a slave to guidelines and validation tools; even those tools can have bugs and errors in themselves, and neither can teach you design or common sense!
I just love those ad hominem attacks ... 'designers' like Laura just hate usability and I have had to work with far too many of them. Nielsen gets this rubbish all the time from them.

Ignore it. Excellent stuff Dan. I have added to your efforts here http://paulcanning.blogspot.com/2008/04/bbc-news-redesign-can-someone-powerful.html
The re-design is an absolute disgrace, and I cannot believe they have launched it.

I can only assume it was a case of the Emperor's New Clothes, and nobody involved had the bottle to stabd up and point out that it looked a shambles.

The usability of the site has gone from being one of the very best on the web to verging on the hopeless.

News sites are read in quite a specific manner, whereby the user scans rapidly for new information. They are not read like blogs. This key requirement has been totally ignored, and they've gone for form over function in its entirety.

Heads should be rolling over this monumental mess-up.

The BBC needs to show that it's prepared to listen and rapidly respond to the overwhelmingly negative feedback that is occuring.

Their reputation is seriously on the line here...
Nick -- thanks, that's a good reason. That said, the "update" posts on BBC blogs have their comements enabled, so exactly what you are talking about, is happening...

Laura -- this just a little side-blog I use for the occasional out-pouring, like this one :-) . My "real" site, which I can't name, is XHTML 1.0 and CSS 2.1 compliant.
"I just love those ad hominem attacks ... 'designers' like Laura just hate usability and I have had to work with far too many of them. Nielsen gets this rubbish all the time from them."

'I just love' the assumption that I am a designer who hates usability. I design, develop and would go so far as saying I am an advocate for usability, and as such, I am aware of taking guidelines and validation far too seriously. In addition, I prefer extensive user testing to prove the rules, this is what I believe Nielsen recommends?

Let's learn from the experts here, Jonathan Snook says of his own colour contrast tool, “this tool shouldn't be taken as gospel but rather should help guide you towards better colour choices. In the end, nothing beats actual user testing.” (http://www.snook.ca/archives/accessibility_and_usability/colour_color_co/)

My point was just that people shouldn't go in, all guns blazing, with the validation tools. A site implemented across so many browsers/platforms is inevitably going to have teething problems and any experienced or inexperienced developer can surely sympathise with that?

The re-design isn't currently perfect, and I do agree with Dan in places, particularly the pixel sizing and search box ambiguity. However, I expect that, just as they have justified other design decisions, they must have reasons for these choices.

Dan, apologies for the site design criticism. I hope that your 'real' site has got beauty as well as its validation badges.
Laura, I must say:

"A site implemented across so many browsers/platforms is inevitably going to have teething problems and any experienced or inexperienced developer can surely sympathise with that?"

That's exactly why a developer should code to standards -- that way they know their new site will display OK in standards-compliant browsers, which is most browsers today (IE7, Opera, Firefox, Safari etc.).

Then they spend the next few hours fixing it in IE6...
Dan, I believe you misread me. Throughout the development process, standards etc. are absolutely vital and I wholeheartedly agree with that.

What I object to is people validating other people's code without having regard, or understanding, for the reasoning behind it. The 'fixing' for IE itself often makes it impossible to validate.
Sorry, yes, looks like I did misunderstand you.

Martin Belam on currybet.net has written that all the validation errors are likely down to the legacy CMS the BBC have to use.
Well non validating code for cross browser compatibility is merely an excuse and a poor one at that.

I have worked on many public sector sites and have taken raw PSD files from designers and turned them into valid markup with complete cross browser compatibility along with the nightmare of AA/AAA level access. This is what being a professional developer entails!

It seems that the BBC should have been spending money on building an in house bespoke content management system to replace their creaky pile o shite rather than prettying up their design. They should hire someone such as myself who has experience in making CMS transitions, we are out there and in the long run would save a lot of time and that means money!
Just to clarify, I don't *know* that the CMS is the reason in this case. However, from experience of doing a site build using the version that was in use in 2005, there were some severe restrictions on the way that the HTML output could be coded, and that always seemed to end up compromising designs to an extent.
If you were to speak to any member of the project team, you'd find that all of them want to make it purely xhtml/css.

The CMS system in it's current form is simply incapable, and with legacy issues and that time that there was for this project, it simple was not going to happen. Moving to another CMS was also a non starter for the same reasons, as well as the implications of training for the hundreds of journalists that work across the sites that use it.

The change to font sizings in ems rather than font tags was a huge change in itself within the publishing system, and along with the doctype, is another small step along a very long road, which I'll stress again, the project team would very much like to be at the end of.
I enjoyed reading this post - and the comments. Dan, you clearly have too much time on your hands.

If you had spent as much time on your own site as you clearly have pulling the BBC site apart your comments my hold some credibility. As it is your critisicms simply appear to me as an ironic joke. On your own site the text is very small, the line spacing is quite tight, the text on the right is prectically unreadable and there are at least 55 validation errors (to me this is meaningless but YOU use the valitator as one of your tools of criticism). Frankly your own site is a classic example of poor usablity design.

Your observations of the BBC website may or may not be true, your criticisms may or may not be valid, but reading a post like this one on a website such as this, the irony is just too much. I can't stop laughing.
Thanks for putting a smile on my face :-)
Very nice - easy to follow, simple, and working. Thanks for the knowledge!
More templates easy to download
We have a nice free fix to the awful BBC news website, it requires Firefox, greasemonkey and the following script. It makes the ‘monstrous’ carbuncle of the new BBC news website look like the previous incarnation with a nice side menu bar, verdana font and it removes all the recent accretions. The greasemonkey script can be found by looking for the facebook site “The new BBC news website looks awful”
Post a Comment

<< Home

This page is powered by Blogger. Isn't yours?