Do you have a profitable online store, reliable suppliers, experienced customers support team, and well-trained delivery service? There are no bugs or omissions on the site? Sounds great! So why to stuff your head with online store mobilization? Can’t you leave the things as they are? No you can’t.
According to IDC analytical Corp. (International Data Corporation) smartphones expected to grow by 32.7% in 2013 reaching 958.8 million units, up from 722.5 million units last year. Thus, the current year is supposed to be watershed, because smartphones expected to account for 52.2% of all mobile phone shipments worldwide. This trend will continue and this will lead to significant increase of mobile traffic according to IDC specialists.
According to “The Economist” magazine with reference to analysts from Morgan Stanley bank investment devision, in 2013 the number of mobile devices with access to the Internet will finally exceed the number of Internet-connected PCs.
And although the volume of mobile traffic is still not as large due to its cost in comparison with PC traffic, we still may observe a stable growth. Statistic company StatCounter gives the following figures: in June 2013 more than 16% of the world traffic came from mobile devices (compared to 10.4% in June 2012). It is worthy of note that StatCounter takes into consideration only smartphones and mobile phones and tablets PCs are not taken into account. Thus, the share of mobile traffic is most likely larger. Experts estimate the trend continues, and the share of mobile users will rapidly grow.
Also, one should keep in mind that mobile users are more active than their desktop “colleagues”. They spend more time being online and are ready to interact with mobile resources. It would be quite weird not to mention the evident fact – the future is the thing of the future. It is really careless of online merchants to ignore this trend.
Adaptive Web Design vs. Mobile App vs. Mobile Website
So how is a mobile shop supposed to cover mobile audience? There are three main options as of today: to make a mobile website, to alter the site applying adaptive technology, or to take the challenge of creating mobile web apps.
Creating a mobile version for website is perhaps the most simple and fastest option as well as the less efficient one. The pages of such site look good only on a single type of device (for example, on smartphones with resolution 480*320) but are not displayed properly on other devices.
Mobile application allows implementing full range of features, to integrate them more closely with a device, and make the interface as intuitive as possible. The problem is each platform (iOS, Android, WP, etc.) requires a separate application, which means spending more money for mobile apps development and ongoing support (updating, bug fixes), which is certainly quite fascinating work but it requires constant budgeting and is time-consuming.
And finally, there is responsive web design option. Responsive websites are the only sites that are well displayed on any kind of mobile devices and on any screen size, while maintaining all the functionality and content. Having invested in adaptive web design once is enough not to get back to this question any more. The pages of such site will be displayed equally well on both – existing mobile devices, and gadgets that will appear in the future. Moreover, there are ways to transform the site in such a way that it will look like a native mobile application on certain devices.
Certain testing showed that well developed responsive websites has an excellent conversion rate. Thus, if to compare the conversion rate before the UX (user experience) is adapted with the conversion rate of the site after the adaptive design is applied, then we will see the main conversion parameters (average visit duration, goal completions, etc.) will increase by three times in comparison with desktop website version figures.
It turns out that the adaptive site is some sort of the happy middle ground. This option will increase the conversion rate, make a site owner richer, and a buyer happier.
The main principles of adaptive design
How does adaptive design work? No matter from what device the website is accessed, the first thing to do is to determine the actual size of the screen classify gadget as either mobile or not mobile one. The layout adapted for the current resolution is displayed on a screen depending on the data received.
The most common screen resolutions are chosen as so-called breakpoints and they are the following: 320 pixels, 480 pixels, 600 pixels, 768 pixels, 1024 pixels and 1280 pixels. The page design is reformed depending on to which control point the current screen size is: elements positioning, content component, fonts, and advertising space are changed. For example, smaller images and previews will be showed on smartphones to save the time and traffic but on a notebook screen full images for the Retina-screens will be shown.
UX undergoes major changes as well. Thus, usual buttons that are not available for desktop version are added to interface so the site would look like a native application on a smartphone. Also, carousel animation between pages is added to scroll and navigate.
Technical equipment of the modern devices also allows applying Progressive Enhancement concept to adaptive sites. Thus, there is an accelerometer in most tablets and smartphones and it may be used for interactive communication with sites. A user shakes a gadget and cleans the last filled field in the order form. A user smoothly moves the device in space and a banner or an image appear on a display. Or, for example, if the GPS-module is active, the site automatically provides the user with a list of nearby shops. The developer is only limited by his imagination. Progressive enhancement is the “trick” that is available to owners of advanced gadgets, but it does not limit the functionality of the site on technically “inferior” devices.
What if… ?
The development of adaptive site is certainly worth attention and big money. Ecommerce beginners which haven’t earned their first million yet may certainly save money by developing adaptive design only for the most important part of their site to make website mobile friendly. In case with online shop these are catalogues and product pages – the pages with the highest abandonment rate.
Before you decide on the sections of your site to be redesigned you need to perform statistics analysis to determine the pages with the highest abandonment rate. This will allow to make improvements where they are the most required.
Another option is to order superficial adaptations that will only deal with page layout. At this neither progressive enhancement nor customized images are adapted.
At this stage the advice for those how want to save money is not to think which of the solutions is cheaper – mobile version, adaptive design, or mobile application. While taking this into consideration you might miss something important. It is better to focus on a series of small but thoughtful experimentation. This will allow you to gradually increase the conversion rate.
It is important to pay careful attention to…
Creating good adaptive design is possible for almost any site. However, there are cases when limitations are imposed by a content management system. That is why it is easier and more efficient to consider adaptive design on a stage of website creation.
It is necessary to consider several things for those who need to implement adaptive design for already existing sites. Once-popular Flash is almost not supported by most modern mobile browsers. It’s high time to refuse this technology in a favor of most technologically advanced and fast HTML5 or CSS3 which are supported by default by most smartphones and tablets sold nowadays.
Another important detail is the order form. The number of fields to be completed should be cut to minimum for mobile devices – for example, name and phone number only, just two fields. Everybody knows how painful and inconvenient is typing long texts on the touch keyboard.
Also, placing and format of advertising are significantly changed in adaptive site version and this must be taken into account as well. For example, large pop-ups that make it difficult to overview page on the compact screen may discourage visitors of online store. In general, there is no clear choice for mobile advertising as of now.
The subject of mobile advertising is very interesting, the interaction of users with advertising on mobile devices is constantly analyzed but there is no 100% correct answer regarding how it should be displayed. One thing is for sure – the same formats and technologies used on desktops are not to be used for mobile devices. Also, we must consider the UX particularities. The experience has led to some conclusions. Thus, more than one advertising place is not appreciated on a screen of mobile device. As for the formats, this should be a banner taking not less than one third or one fourth of a screen. Such banner will not discourage users as we are used to scrolling on mobile devices: if the banner is not interesting we just scroll it, if it is interesting – we click it. These are just observations but not iron clad rule. In any case, to take one or another decision you need to conduct a series of experiments on the proportion of traffic in order to understand if the theory works.
The net result is that…
The responsive design is not just a mobile version of your online store. There is no place for compromise, no casualties. With the use of adaptive design technology the functionality of the site does not suffer but on the contrary, it increases thanks to the progressive improvement and provides the user with new features which are not available on a desktop PC.