Why eCommerce Mobile Experience Is More Important Than Ever in 2015

As we pointed out in our Infographic “How healthy is your Magento Store?”, as of 2014, mobile traffic has surpassed desktop for eCommerce traffic. In fact, approximately 52% of all eCommerce traffic now comes via mobile device or tablet, while 68% of final sales took place on desktop computers. What this tells us this is that while […]

By Caitlin Mekita

why-mobile-matters

As we pointed out in our Infographic “How healthy is your Magento Store?”, as of 2014, mobile traffic has surpassed desktop for eCommerce traffic. In fact, approximately 52% of all eCommerce traffic now comes via mobile device or tablet, while 68% of final sales took place on desktop computers. What this tells us this is that while most people are using their desktop computers to make final purchases, they are relying on their phones and tablets to browse for products they may want to purchase.

Because of this, it’s more important than ever to create a positive mobile experience for your shoppers. This is especially true if your customer base is younger, and if your brand attracts shoppers who casually browse as part of their shopping habits.

Furthermore, if you engage heavily in Social Media activity ( Twitter, Facebook, Pinterest), keep in mind that most (about 60%) of social media users are using mobile devices, so there’s a good chance that the traffic you generate from your social media activity will be mobile. Because of this, it’s important to make sure the landing pages for your posts and tweets look great and are easy to use on mobile devices. You don’t want to put a link on Twitter,  only to have your followers land on a page that isn’t optimized for mobile devices.

how-to-design-mobile-experience

Responsive Design or Mobile Websites

Responsive websites use an adjustable grid to change the size and layouts of certain elements based on screen size. A responsive width is either fixed or fluid, meaning that either it will adjust by steps with each different screen size (fixed), or will stretch and shrink like an elastic because the elements are all based on percentage widths (fluid). Fixed and Fluid widths each have their pros and cons, however because of the increasingly wide range of screen sizes available on different tablets and devices, I usually prefer simple, clean layouts with fluid widths. Responsive designs use the same information as desktop pages, but simply rearrange this information to be easier to read and use.

Mobile websites are different from responsive because on mobile websites, the information and layout may vary greatly from the desktop experience.  Because of this, mobile websites require a different theme installation, content management, and therefore, additional maintenance. Mobile websites have their perks for extremely large businesses, but are usually not necessary for most eCommerce stores.

If you need help with your Magento store, call 845-656-3000 or Contact us here »

Navigation

Navigation is key when it comes to mobile user experience. If you use a mega drop down with images or videos on your desktop site, it’s probably best to eliminate those on your mobile navigation. The mobile navigation should be easy to find (generally on the top left corner), and can be represented by a “hamburger” button, or simply the word “menu”. Similarly, your account, login, and wishlist buttons can be represented by icons to save space. Remember that all navigation items & buttons should be at least 20px by 20px in size, because this is the area that a finger can target precisely.

Products

Product presentation is imperative on your mobile website. If your home page features a slideshow or featured product slideshow, make sure a user can browse these sliders on mobile by swiping their finger across the screen. Your product images should be large and again, if you use a product image slider, it should be swipe-able. If there is a lot of information on your product page, you may to use an accordion effect to hide the information that the user isn’t reading. Remember that your add to cart button should be large and should be colored in a way that really stands out.

Cart & Checkout

Your cart and checkout process should be simple, especially on mobile. If you are tempted to include a lengthy guest registration with questions like “how did you hear about us?” or options to opt-in to multiple newsletter subscription lists , I would advise against it. This is not the time or place to be bugging your shoppers or acquiring demographic information. Allow shoppers to easily check out as a guest, but give them a way to sign into their account without leaving the checkout process. Some retailers have found that it’s helpful to remove the standard header and navigation, so the shopper doesn’t get distracted and go somewhere else.

Conclusion

conclusion-mobileYou know how important it is to keep your customers happy and encourage them to return to your eCommerce store because of a great shopping experience. As of 2014, most traffic to eCommerce stores is coming from mobile devices, which is why a positive mobile experience is now more important than ever.

Customer Success Manager