Government adopts responsive design for mobile website

The government has started to use responsive web design for the first time ever, according to the Government Digital Service (GDS).


The government has started to use responsive web design for the first time ever, according to the Government Digital Service (GDS).

It is using the new approach to address issues with building a mobile version of the GOV.UK single domain website that is currently under development and hosted on Amazon Web Services.

It is possible that the finished GOV.UK site will eventually replace Directgov, which has had a mobile site since 2005.

The Directgov mobile site has until now existed on a different, separate platform to the full website. The content is created by taking feeds from the main website and using a database of handsets known as WURFL (Wireless Universal Resource FiLe)to identify mobile devices and screen size.

According to GDS, this approach "works – but it's not ideal" for the nine percent of visits to Directgov that come via a mobile device.

Another issue is that a new mobile website needs to work on an increasing number of different types of devices, from smartphones, tablets to laptops, TVs and gaming consoles.

This is where responsive web design – 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 used – comes in.

"For the first time in government, 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," said Colin Harrall, in the GDS mobile team.

He explained that responsive design works by using a series of cascading style sheets (CSS) that tell the page how to behave. The style sheets ask a number of 'media queries' to find the width of the browser being used, which then tell the page to respond with the appropriate style.

"You can then make further style decisions such as image resizing, touchscreen features, and so on, as appropriate," he added.

There are downfalls to this approach however, for example, it can be slow to download full web pages over a mobile network, which can be expensive for people with limited data contracts, and also some mobiles do not support CSS.

GDS plans to solve this by using a 'progressive enhancement' approach, which involves designing the website for the mobile platform first. Extra style sheets can then be added for larger devices.

"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," said Harrall.

GDS has so far used responsive design in the development of its upcoming, shared GOV.UK corporate publishing platform beta to be used by government departments.

It plans to roll out the approach across the rest of the GOV.UK beta in the coming months.

"Recommended For You"

GOV.UK: We get similar weekly traffic levels to BBC Weather and Sky News Second phase of GOV.UK launches