The explosive growth in mobile devices usage is changing business and society in unexpected ways. The number of users with mobile devices is expected to climb to 10 billion by 2020 (source: Cisco Systems).
"Sales of smartphones is exceeding the sales of desktops and laptops for 2 years already, and tablets are hot on their heels. Mobile devices will soon be the primary way most people access the Internet—the only way for a growing population,” says PJ Utsi, Chief Creative Officer at Vaimo, a leading provider of eCommerce solutions on the Magento platform. “This is a sea change, and it means that the needs of the mobile world will dictate the future design of websites."
The problem with today’s websites can be described quite simply: they are typically designed to be 1 000 pixels wide, a dimension that works well on most desktop or laptop screens. These screens are stable in use- the size is consistent, the top is the top and the main interaction interface is a cursor that can be used to point to small areas with great accuracy.
By contrast, the screen real estate available on mobile devices varies dramatically in size, from three inches to something not much smaller of a typical laptop monitor. Even more challenging, the screen can be used in either landscape or portrait orientation simply by turning the mobile device in your hand. Another constraint is the use of fingertips instead of cursors, greatly reducing the pointing accuracy.
In the field of Web design and development, we’re quickly getting to the point of being unable to keep up with the endless new resolutions and devices. For many websites, creating a website version for each resolution and new device would be impossible, impractical and expensive option, even if only the most popular devices were chosen. We need to approach Web design in a completely new way by using Responsive Design.
Responsive design approaches design from a framework perspective, working to develop principles that will create a uniform look and feel and make available the same content and features irrespective of the device, screen size or orientation. Hallmarks of the new design approach include automatically adjusting the layout and design of the site to provide an optimal user experience for all devices. But coming up with a way to present the same web site on a mobile screen, that is only 20% of a desktop screen, is no small feat. This is where one of the greatest challenges with designing and building web sites for mobile devices lies in.
"Our principle is to get our clients’ websites to look and behave as much like the native apps as possible. The popular native apps for gaming, social and e-mail are setting today the standards for a good user experience on mobile devices and the web is lagging behind."
Utsi explains, "For example, if the user follows a link from an e-mail onto our client’s site, he or she must find the user experience to be of the same or higher standard. You can’t have lots of tiny little links and minute pictures that are hard to see on a busy screen."
In other words, the days of beautifully rendered, design-heavy Web pages might be numbered. They will be replaced by simpler, easier-to-use web pages that work well on smaller screens with touch-friendly links and buttons. According to Utsi, separate .mobi sites are not a solution partly because of the added expense but primarily because of the need to provide customers with a consistent, integrated user experience.
"If I find a product I want to buy on a site using my desktop and then can’t find it when I am ready to make the purchase on my smartphone because it’s a totally different site, that’s a disaster and most probably a lost sale,” he says. “This obviously goes for the entire web – users want to find the same content and do the same things on their mobile devices as they do on a desktop. To the user, it is really only a matter of different screen sizes – not whether a device is mobile or not – and this is what responsive design is all about: Making sure that the user has full access and a great experience, no matter what device they’re using."
"These are still early days for responsive design, meaning there are few standards to rely on as yet", Utsi says. However, Vaimo is already using the technique for many of its clients - the recently launched Björn Borg responsive clothing site is a good example (http://www.bjornborg.com/en/).
"It’s all about what customers want—smart companies are making the change now in order to build their brands by delivering an experience that is optimised for mobile devices", concludes Utsi.