In July 2012, there were already 6 Billion mobile subscribers worldwide. That’s 87% of the entire world’s population. In December 2012, the mobile share of web traffic across the world was 14.55% compared to 8.04% a year before. In the US, 25% of all web traffic comes from mobile-only users, while in developing countries like Egypt these numbers go up to 70%. If the growth rate continues like that, we can expect mobile internet to take over desktop internet usage by 2014.
There is no way around facing this rapid change. More even, we would do good embracing it so we can adapt early and ensure a steady experience for our users — now and in the future. As mobile internet usage increases, so do the expectations users have towards your website. People will have easier access to high quality devices and better mobile networks. They will be more flexible in time and place when visiting your website, and as a consequence their user behaviour will change.
The smaller screen size is only one challenge we face with the shift away from desktop to mobile. There are also other hurdles that we need to overcome. While technical limitations and different interactions might be rather obvious challenges, we also need to think about more specific aspects like the different context of use and different user behaviours. Here are 5 key concepts for mobile web design to look out for in 2013.
1. Variety in screen size & screen resolution
Let’s start off with the most obvious challenge of mobile web design — the limited screen real estate. Over the last couple of years, the industry has developed great web standards for desktop devices. Usability is hardly the issue anymore and designers have what seems like boundless possibilities to create exceptional user experiences. With an increasing focus on mobile devices, some of these possibilities will not be relevant and new standards need to be defined.
Mobile describes any handheld device, such as tablets or mobile phones. Screen sizes and resolutions vary widely, making it an even bigger challenge to meet the requirements for all different devices. To name just a few popular smartphones, the iPhone 5 has a resolution of 1136 by 640 pixels at 326 pixel per inch (ppi), the Samsung Galaxy S3 has a resolution of 1,280 by 720 pixels at 306 ppi and the Nokia Lumina 920 has 1,280 by 768 pixels at 332 ppi. The retina display of the new iPad with a screen resolution of 2,048 × 1,536 pixel at 264 pixel per inch (ppi) even requires special images to avoid a blurry display.
At this point, there are a couple of different solutions that help you deal with your mobile site. You can:
Show your desktop version and have users zoom in to see your content
Build a mobile site with HTML 5
Build a native app for mobile devices
Go for a responsive design
There is a big debate going on whether to stick with a native app, or build a mobile site with HTML5, and this debate will continue in 2013. For example, Mark Zuckerberg just recently decided for a new native app for Facebook, because he believes that HTML5 is not ready yet. As a reaction, Sencha built Fastbook, a technology proof of concept that demonstrate that HTML5 provides the tools to write apps that are comparable to native ones in performance. Personally, I think that a responsive website is the most flexible and most convenient way to go about your mobile site.
In any case, less room also means less content — or at least less content at once. So you have to prioritize. A good approach might be to design your content mobile first. Include only the most crucial and time- and location-specific functions and features in your mobile version. Keep it simple and clean try to avoid promotional or other distracting content. It is important that you keep your key features consistent on all devices to help your users find their way and avoid confusion. Mobile users typically look for small pieces of information, and they want them quickly.
2. Technical limitations
Mobile networks become more and more advanced and in some areas even 4G is available, ensuring a smooth and fast mobile connection. 3G has been launched in 159 countries and more than 45% of the world’s population is covered by a 3G mobile network. These numbers sound exciting and, living in countries like the US, you might find it difficult to imagine any other standards. Yet, about 55% of the world’s population has to deal with slower mobile connections.
Slower connections lead to longer loading times and require us to seriously consider the data load of mobile websites. For example, video and large images can slow down a website tremendously, at the expense of both the usability and the user experience of the site. If you cannot guarantee that your users have access to a fast mobile connection or access your site using wifi, then make sure you strip down your site to what’s most important.
Apart from the connection, mobile devices now and in the near future will always be limited by less powerful hardware and limited software support for multimedia as well as multimodal content. Therefore, it will always stay a challenge to create the same user experience on both mobile and desktop devices.