Mark Hurrell.

BBC News responsive website redesign

Even in 2010 mobile traffic was starting to dominate news
Responsive design was still an emerging technique, and tablets were new so we didn't really understand how people were going to use them yet. As a result I experimented with lots of different layouts and navigation methods
The responsive redesign featured a modern component-based page architecture which allowed us to make changes quickly. Back then the tools weren't self documentating, and instead required more traditional documentation
A lot of users were still on traditional feature phones, while there were a lot of weird tablet form factors being released. Creating separate traditional web layouts for each of these device segments would have been financially impossible (even for an organisation the size of the BBC).

BBC News responsive website redesign

Senior product designer for the BBC

2011  2012

The BBC News redesign was a success, but by 2010 traffic was already beginning to migrate to mobile. At the time, the BBC’s corporate strategy treated desktop, mobile and tablet as parallel product verticals, with different editorial teams based in different cities.

Responsive design was still an emerging technology. Alongside the fixed desktop version we ended up shipping, I’d developed a responsive prototype of the 2010 redesign but it was considered too complicated for GEL to deal with. What I didn’t know was that, at the same time, Matt Chadburn had been selling in an efficiency business case for responsive design. We got a small team to explore it.

We developed a mobile-first, full-componentized responsive version of the BBC News website. I prototyped, designed and built the responsive interfaces, and worked with designers from the central BBC design team to adapt GEL patterns for it. I came up with the idea of putting GELs huge number of icons into a font (sorry) to reduce page weight and complexity of the CSS. I left the BBC around the time it went into public beta.

It’s weird to remember that we were the one of the first large content websites to launch a responsive site, alongside Ethan Marcotte’s team at The Boston Globe. The fluid grid and typography techniques I conceived, designed and developed were written about in industry press like Wired and A List Apart, and have been cited in numerous textbooks. My favourite example describes my work as a “clever collaboration between designer and developer”, and my blog post about this project received 30,000 unique pageviews in a month. See also: BBC GEL and the BBC News website redesign.

Responsive news beta team: David Blooman, Matt Chadburn, John Cleveley, Aidy Lewis, Tom Maslen, Andrew Vos with design from Julian Kirby and Melanie Seyer.

Selected projects