If we were to hop in a time machine to the year 2002 and look at the world of web development, we’d see a very different picture to that we see today. There have been a number of radical shifts in terms of development and design in the last decade – from new versions of Flash to the move to HTML5. But the way we view the web has also changed radically. Ten years ago, the most popular browser resolution was 1024×768, and the most popular browser was Internet Explorer. In 2012, resolutions and browser usage differs drastically across the board. Some people browse with their smartphones, others with their tablets, and some even use their TVs. The point is, the web has had to adapt and change to deal with this shift – so much so that its future now appears to be focused around two things: mobile and responsive design. Let’s look at these in more depth.
The rise of mobile browsing:
The concept of browsing the internet on a mobile device really began to take hold of the public consciousness with the advent of WAP technology. The Nokia 7110, released in October 1999, was the very first mobile phone to feature a WAP browser. However, these early days of mobile browsing were really just ‘lite’ versions of the internet. WAP-specific pages were created, but they were unwieldy and difficult to use. It wasn’t really until the mass adoption of smartphones that mobile browsing really became popular – and that was likely thanks to Apple’s iPhone being released in 2007. Following that, tablet computers hitting the mainstream (again, likely due to Apple’s iPad) in about 2010 solidified mobile browsing as a regular medium for web browsing. With more and more manufacturers entering the mobile market, with tablet computers like the Nexus 7, it seems clear enough that user trends will shift to this form of web browsing quite quickly. New revisions of Apple’s hardware seem to appear at least once a year, and show no signs of stopping just yet.
Mobile resolutions and responsive design:
The increase in usage of mobile web browsing meant one thing for web developers: they had to find a way to make their sites look good no matter how a user was viewing them. This meant they had to bridge the gap between the people on their HD monitors at 1920×1080 and those on their iPads at 1024×768 (or, as with the new iPad, 2048×1536). The answer to this was responsive web design. In a nutshell this refers to any site design that actively adapts to the resolution in which it is viewed. So, for example, someone viewing a site on an HD widescreen monitor may see a site with a large header image and navigation menu, whereas someone on their smartphone would see just a logo and the nav menu arranged vertically. You can test out responsive design by resizing your browser window; if everything stays the same, the site isn’t responsive; but if elements shift and move actively as you increase and decrease the size, you’re seeing responsive design in action. Media Queries has an expansive list to highlight some responsive design. This is different from mobile versions of websites, which are entirely separate entities; responsive design is the same site adapting depending on how it’s viewed. And many think it’s the future.
Where do we go from here?
With more and more mobile devices hitting shelves, and a greater focus on adaptive web behaviours, it seems clear that responsive design is here to stay. The benefits to businesses and site owners are that they can feel confident that their site is selling/entertaining/informing as well as it possibly can regardless of who is viewing it. This knowledge is vital in providing a consistent quality in terms of user experience, and it’s something that more and more businesses and developers are likely to latch on to. Creating a universal experience for all site visitors works very much in the favour of the site owner – particularly for businesses. Does it mean that some developers will need to ‘re-learn’ certain aspects of their trade? It does indeed – but isn’t that just progress? And as we all know, you can’t stand in the way of that.