Directgov has had a mobile website since 2005. To put this into context, the top selling device that year was the Nokia 1110 (pictured below) – so as you can imagine we were quite limited with what we could achieve.
Since then, mobile has exploded. Digital cameras, email, mp3 players, games, maps and more - mobile has been described as the remote control for your life.
We’re now seeing around 9% of visits to Directgov coming via a mobile device and we’ll see over 2 million visits to the mobile site in January. The recent Businessinyou campaign saw 17% of it’s traffic coming from mobile.
Nokia 1110
Up until now, the Directgov mobile site has existed as a different entity to the full website. It’s built on an entirely separate platform, taking feeds from the main website for its content and using a database of handsets (known as WURFL) to identify mobile devices and screen sizes. It works – but it’s not ideal.
The mobile Directgov site on a phone
In addition, our users are now accessing the internet on an ever increasing variety of devices: tablets, laptops, smartphones, feature phones, desktop computers, TVs, gaming consoles and more. So what’s the best way of building a site that works across all these devices, and is future-proofed for new devices coming to the market?
Introducing responsive design
With Government making rapid progress towards a single domain, we’re presented with a fantastic opportunity to start from scratch. So, for the first time in Government, following in the footsteps of the Business In You campaign site (made by Helpful Technology) GDS is turning to responsive design – a solution that we think can offer a high quality user experience that is both easy to use and performs consistently across a massive range of devices and screen sizes.Simply put, responsive design is the discipline of building a website based on a flexible grid system, where the elements on the page rearrange themselves depending on the size of the browser being used.
It works by using a series of cascading style sheets (CSS) that tell the page how to behave. The style sheets ask a number of questions (called media queries), to find the width of the browser being used, which then tell the page to respond with the correct style for that page width. You can then make further style decisions such as image resizing, touchscreen features, etc. as appropriate.
It’s also pretty handy for optimising the web page on non-maximised browsers and for tablet and smartphone users who can choose between a portrait page orientation or landscape.
It’s important to remember though that it can be slow to download full web pages (with added CSS) over a mobile network and potentially expensive for users on pay-as-you-go (or limited) data tariffs. And some low-end mobiles don’t support CSS. Luckily there’s a very elegant solution to this too…
It’s known as progressive enhancement. If you design your website for mobile first, and then add extra style sheets for larger devices, then you solve both the CSS problem and the data problem in one fell swoop. Progressive enhancement means that you make the most basic version of your site (i.e. mobile) the default version and then build outwards, adding extra layers of style as the browser size gets bigger.
We wanted to build responsive design into the ‘Citizen Beta’ when we were in the planning phase back in August, but large scale implementations were very thin on the ground. We felt it still had some evolving to do before we were ready to commit to using it, and our priority has always been to get something up as quickly as possible so we can begin iterating.
But the digital world moves fast and we’ve had to be nimble to keep up. By the time work on the shared gov.uk ‘corporate’ publishing platform kicked off in September, responsive design was firmly on the scene. Hence we’ve incorporated it in the upcoming corporate publishing platform beta, and we’ll also be looking to roll it out across the rest of the GOV.UK beta shortly afterwards.
How part of the beta of GOV.UK looks on a smartphone
We think this is a great solution for optimising a site across a whole range of devices and you can expect to see it roll out as part of GOV.UK in the coming months. We’ll be covering this in more detail here as we progress.
Colin Harrall is working on the GDS mobile team
Filed under: Directgov, GDS, Single government domain
