How You Can Create A Mobile Friendly Online Store

by Steve Walsh August 26th, 2014 

Predicting and adapting to new trends or major shifts can certainly give your business a competitive edge (and failing to do so can force you out of the race as well). Mobile ecommerce is one such trend where you need to adapt to stay in the game. If you think that mobile is the future of computing, you are probably wrong, because mobile is pretty much the present (future is something like Google Glass).

At this point in time, US consumers are spending more time at online stores using tablets or smart phones as compared to Desktops. From June 2010 to June 2013, the mobile Internet browsing saw an impressive 359% increase, as compared to a measly 4% growth in desktops. In 2013 alone, the mobile commerce sales grew a whopping 63% percent. Veteran designers have been talking about mobile-first approach for years. In short, you're already late if you are starting to think about your potential customers browsing your online store via tablets or smartphones. Having said that, it's better late than never, besides not many online stores have started to catch up with this shift, so you're in a good company.

So what should you do? To put it in plain words, you need to design/redesign your online store to make sure it is responsive, adaptive, and user friendly for mobile users. Because you want your online store to appear and perform equally well on all devices including but not limited to Desktop computers, laptops, tablets, and smartphones.

Creating A Separate Mobile Friendly Website Vs. Responsive Design

While creating a separate website for tablets or mobile devices is a feasible option, it is usually better to go for a responsive design (a single website that adapts to different devices or screen sizes). Because it will make it easier to manage, update, market, and optimize your online store. On the other hand, a separate mobile site can help you with cutting down the content or limiting images altogether. You can also consider creating an App because consumers prefer browsing online shopping websites through apps as compared to web. However, for small businesses and online stores, creating a mobile friendly, responsive design is usually a more practical option.

In case you are using a CMS like WordPress or Magento with a premium theme (and in rare cases, a free one), there's a chance that your online store is already responsive, and all you need are small tweaks and changes. But if that's not that case, or you are just about to launch an online store, following are some important tips to help you create a mobile friendly website.

Make It Simple

- A complicated or cluttered design will look bad on a 19 inch monitor screen, let alone a measly 3 or 4 inches available in a smartphone. So, you need the mobile version of your website to be simple, and to the point.

- Start from navigation or menu bar. You need to present them in form of a drop down menu preferably under your business name and description. Think from the perspective of your customer browsing your store from a smart phone. Instead of adding links to your business history or about us page, you should probably make it easier for them to find and go straight to your shop and have a look at your products. So, keep the navigation menu short and simple, and give them a search bar so they can easily search for the pages that you have left out in your mobile friendly version.

- Theres no one-fit-all solution when it comes to responsive web designs or layouts. Single-column layouts can be a safe bet, especially on relatively smaller mobile phone screens. Something as simple as a business logo and description followed by a table of contents is a good starting point, allowing the customers to go straight to their desired sections. And it also allows the page to change between landscape or portrait mode quite easily. But that might look a little too bland, so you can search online for examples or visit different online stores from a mobile device to find some Inspiration.

Make It Fast

After the screen size, the second big difference between a Desktop computer and smartphone is the Internet speed. While we are reaching to a point when the browsing on smart phone will be as swift and seamless as you can expect on a desktop, but you should not design your website with the best-case scenario in mind. And even if the mobile users are getting the same speed, they don't usually have the time or patience like the desktop users.

Ironically though, consumers browsing through the mobile phones prefer videos or images over the text. So you cant get away with eradicating all the images or videos. Besides, images are an absolute must for an online store, so you should provide them with lower resolution version of the images. For videos, you should be using a technology and video player that provides a flawless video experience. Remember the videos and image zoom functions should work equally well on almost all mobile devices and operating software.

Same goes for the content and additional features. Try to keep them to bare minimum. Too many features or lengthy pieces of content will do nothing but irritate your customers by taking too long in loading. Besides, as earlier suggested, someone browsing from a mobile phone wouldn't be too interested in all those fancy graphics, heaps of content, additional features, or add-ons. Try to reduce the number of requests or data transfers for better speed.

Keep The 'Touch' Factor In Mind:

The third big difference is the practice of using fingers for browsing and tapping on the screen, as compared to the use of mouse and clicks. So, all of your links and buttons should be large enough to let them tap easily, without having to pinch the screen and zoom every time they want to tap on a link. Use space between links or buttons wisely.

While designing your online store, remember that the users will be holding the smartphone or tablet with one hand and using the other one to navigate through your products and offers. Design your website in a way that all they will need is to slide, and tap, without having to flip the smart phone between landscape or portrait mode, or pinch for zooming in and out all the time.

Shopping Cart & Checkout Process

There are many mobile friendly shopping carts and mobile commerce tools available. But regardless of which shopping cart you use, you should make sure that you are not making them fill lengthy forms and unnecessary fields. Use drop down options wherever possible, and make sure they don't have to enter lots of text while making an order.

If your checkout process requires them to sign up first, verify their emails, and then login before making an order, it's a no-brainer that they will take the easier route and LEAVE.

Unlike desktops, mobile commerce transactions are often carried out in public, so the more you can do about making it secure by using a well known checkout and payment gateway, the better.

Lastly, don't forget to test your online store, ideally on real devices like smart phone or tablet, while keeping your target users in mind, instead of simply looking at mobile versions via one of those online emulators. They are good as far as appearance is concerned, but you need to get a feel of how your website, shopping cart, or checkout works in real.

Steve Walsh

Stephen Walsh is the director of Lightship Digital, a company providing Conversion Rate Optimization, and PPC Management Services to its clients.

Lightship Digital

You May Also Like

One Response to “How You Can Create A Mobile Friendly Online Store”

  1. [...] How You Can Create A Mobile Friendly Online Store, Search Engine People Blog [...]

Leave a Reply