You can read about RWD on Wikipedia here but in a nutshell, it is designing applications which run over the web which automatically adapt to the device that content is being used on. CSS3 media queries is the magic here, which through rules based on device characteristics, allow the layout to adapt, including the position of the most important content, the size of images being displayed or whether advertising even makes in on to the screen.
The advantage of using RWD is that you effectively only write one web application or web site…it adapts itself based on how it is accessed. There are some good examples on the web which are worth taking a look at.
The Boston Globe’s site uses CSS3 and if you resize your browser window to emulate different form factors, you will see the content resize to provide an appropriate level of detail. Photo sizes will alter and the general content moves to fit the screen you are viewing on, adverts disappear and the most important stories are presented at the top of the view.
Wellington Sculptures site also applies responsive design to the site. There is not a separate desktop, tablet and mobile application – just one site which adapts. As you size the browser, the menu bar and map will shift location to suit the real estate available. Wellington Sculptures also list the cool technology that they have used on their site here, which includes RWD, HTML5 Local Storage and Geolocation.
So how could this be applied to mainstream GIS web applications?
At the moment, most GIS vendors develop specific desktop applications and specific web applications. They even develop different flavours of web applications for different form factors; smart phone or tablet. Surely there has to come a time where RWD enabled applications make the current need for such variety redundant. That makes life so much more simple for us all.
Imagine, just one application that you point people to and you don’t care what they are using in order to use your application. The layout and the content, even items such as tools, they all adapt to become relevant for use on the device that you are using. Viewing on a tablet may provide you with more options for accessing content through a toolbar or a floating panel, but if you access the same site on a smartphone, perhaps you access that through a menu which becomes enabled as you use it. Fundamentally however, the site is exactly the same, but the CSS is controlling how it is delivered to you.
It can’t be long until we see these increasingly standard web development techniques making their way in to the applications that we are building for clients or using as consumers. I for one can’t wait for the time that I don’t have to hunt for the “Mobile Edition” link on the website or be forced to use a different version of a site with lower functionality on the device that I have with me all of the time. Having the application respond to my device and its capabilities seems to me to be a much better user experience.
In the very near future I believe that we see the Esri Web APIs, or web application tiers such as Geocortex Essentials, supporting this capability. I for one will be keeping an eye out for developments in this area. A combination of RWD, web services and the cloud is going to make for a very powerful content delivery and analysis platform. The proliferation of mobile devices will drive this capability as our internet capable smart phones continue to become the device we use most to access the web.
– Neil