responsive-web-design.png

Ecommerce In The Mobile Age

Ecommerce Guides

For the most part, our attention has been squarely focused on building an ecommerce website and attracting attention, through a combination of search, paid and other marketing methods. But to ignore mobile in all of this would be to fail to acknowledge both the present and the future of ecommerce. People now use mobile and tablet devices to browse and shop online – not only as an add-on, when they can’t get to their computer, but as their primary device.

As anyone who has ever tried to get stuff done online on a mobile platform, not every website just neatly presents in mobile formats, and your customers will be quick to head elsewhere if your website isn’t mobile-ready. If you want to capitalise on the number of users buying on mobile and tablet devices, you need to think about optimising your buying experience for them too, and providing responsive designs and apps that fit with their browsing needs.

Ecommerce Mobile Growth Graph
Source: www.kunocreative.com

The Differences Between Mobile and Desktop

Mobile is no longer a fringe source of traffic. It is now one of the major ways people buy online, and you can’t rely on your current ecommerce design to always deliver the goods.

Screens present differently, browsers present differently, and users interact with the web differently on mobile and tablet designs. Most people work around this by presenting mobile and tablet users with a separate version of their website, optimised for mobile devices.

There are a few things to bear in mind when thinking about presenting your website on mobile.

  • Buttons Need To Be Bigger: quite simply, your buttons and menus need to be bigger and more spaciously laid out. A finger tap is always less precise than the click of a mouse, and you don’t want customers accidentally missing the buy button and opening up other windows on their mobile, virtually killing the sale stone dead. Leave plenty of space around your buttons and make them big and easy to press, so you’re not restricting your customers’ ability to buy from your site.
  • The Fold Has Moved: your ‘above the fold’ considerations will have changed on mobile. For most purposes, this will mean you have more space to play with, but depending on page orientation you may be playing with less. Make sure everything you want to be above the fold on your homepage, category pages and product pages still stay that way when you view your website on mobile.
  • Page Orientation: The page orientation issue is one that may require some design tweaks. You want your page to present well on the horizontal as well as the vertical orientation, so customers can still buy your products regardless of the dimensions and orientation of the device they are using.

Responsive Mobile Ecommerce

Responsiveness is a key element of design, and you should be on the lookout for responsive themes or designers when you are putting together your ecommerce store. Responsive websites adjust to fit the different dimensions of the various devices people might use to access your site. This prevents your pages from requiring scrolling or manual resizing, and even means you can present the same version of your website to users across a multitude of devices.

May also like:  Choosing Your Ecommerce Store Design

responsive-web-design

Responsiveness means you don’t have to create different versions of your website for the slightly variant specifications of smartphones and tablets your customers might conceivably use to access your website. Yet, if you ignore these users, you are cutting out a huge percentage of your traffic and ultimately sales.

A responsive theme or design from the outset will leave you in the strongest position when it comes to handling mobile traffic, and will mean you don’t need to opt for several different variations of your website to ensure you have all the bases covered.

Responsive vs. Adaptive Design

Responsive design is the standard, and those in the design community tend to favour a responsive approach because it leads to less difficulty in handling alternative traffic formats. A responsive design is as good on mobile as it is on desktop, and it doesn’t matter which device you end up using to view your site. Responsive design allows you to put content at the heart of your site, whatever the viewing experience, without cutting off double-digits percentages of your traffic.

Which solution is better for your mobile website?

[table id=4 /]

Adaptive design is the next best thing, where responsive design isn’t a possibility. This might be where you already have a non-responsive website in place, and you’re not heading for a full redesign. Adaptive is, as the name implies, adapting your current web design to fit with different devices, rather than hard-wiring responsiveness into your structure. It can be slightly more cumbersome to setup, in the sense that you will need multiple designs for different screens and devices. However, this is often easier than trying to make a non-responsive design responsive, and most would advocate either starting your design again or switching to an adaptive approach if you find yourself in this boat.

Alternatively, you can serve up a much more feature-light experience for those viewing your content on tablet and mobile devices, and it might be the case you can get away with this lower-level adaptive design. Whichever format you choose, one things remains certain – that to mistreat mobile traffic now is crazy, and that to mistreat mobile traffic into the future is akin to business suicide.

Creating Apps

If you are serious about building a framework for your mobile and tablet users to buy from your site, it may be worthwhile developing apps which can be used to buy from your website directly. Apps can provide a more customised experience for users, and rather than channelling through various different mobile versions of your website, breaking down your catalogue into manageable apps for both Android and iPhone users can help you reach a wider audience in a way that is suitable to them.

May also like:  Ecommerce Store Checklist

Apps can provide a better user experience, without the need to navigate through a mobile web browser. Instead, customers can simply fire up the app and start making purchases through your store – perfect for encouraging your regular customers to shop more easily (and hopefully more frequently), and for avoiding the user hassle of navigating through the browser.

There are services available which allow you to develop apps using your existing website, often requiring just a small cost for you to use the app as your own. Alternatively, you can outsource app development to a coder with particular expertise in the field. Freelancing sites like oDesk and Freelancer.com can help you get the job done for a fraction of what you might pay a large agency – if you can find a seemingly reputable supplier within your budget (ask to see examples of their previous work), you can save yourself a fortune.

When developing an app for your site, you will need at least two different apps – one for Android OS devices, and one for iOS. If you can only afford one app to begin with, choose Android – there are way more devices running Android platforms than there are on iOS.

Creating Mobile Websites With Mobify

Mobile traffic is clearly, at the very least, here to stay, and the need to focus your efforts on improving the mobile shopping experience are growing ever-greater. Mobify is a service which helps companies optimise their website for mobile traffic specifically, delivering insights into mobile users and their interaction with your website as-is. This makes it possible to gradually optimise your mobile buying experience, making sure your ecommerce store is capitalising on all the traffic it attracts.

Striving for a ‘mobile mature’ ecommerce store delivers benefits in the here and now, as well as ensuring you are well placed for the mobile years to come. As even more people switch to mobile browsing in preference to the web browsing habits of old, you’ll be in the strongest position to both retain and attract their business. Using Analytics To Measure Mobile Activity Mobile activity is another area you can put under the microscope, in terms of applying analytics processes and growth hacking. By identifying how people interact with your mobile website or app, and running tests to find winning configurations just like your standard optimization process, you can increase your results in line with the goals you are optimising for. A number of services exist offering the ability to track and measure analytics data, specifically for mobile users:

  • Segment.io
  • TestFlight
  • Localytics
  • Google Analytics
  • Mixpanel

Further Reading/Useful Tools