Demac Media Demac Media Brand Demac Media Brand



Tips to Designing a Better Mobile Checkout

Timer Icon 4 Mins


Everywhere you look people have a cell phone, it has become the modern day equivalent of wearing pants in society. Think about it, when you ask someone for the time, more often then not they pull out their cellphone instead of a watch. Because of this, sites more then ever need to target the ever growing mobile demographic; specifically in this post mobile checkouts. Here is how to improve your conversion rate though designing or developing an eCommerce site.

Tip #1 – Large, easy to find buttons


When dealing with mobile you want to keep in mind the screen real estate, especially with all the information that could be found on a checkout page. By making sure checkout buttons are larger, they increase readability and usability. People want to be able to easily find and click the checkout buttons and get on with their lives.
It can also be a good idea to have multiple checkout buttons so they are easy to find, especially on longer checkout pages. Also another option could be having a fixed “sticky” checkout button which sits at the button of the window while the user navigates their purchases or completes checkout info.

Tip #2 – “Cut the fat”


On mobile, every pixel is precious as it is a tightly confined area to display a ton of information. Which is why this tip is one of the harder ones to accomplish. But is also a very simple concept…”Cut the fat” is exactly what you want to remember when addressing mobile. If a user can live without it, get rid of it. If they can’t, try different approaches to encapsulate the info. Also it doesn’t hurt to have an area to reassure users that their checkout is secure. This helps alleviate virus or security concerns.

Tip #3 – Mobile UI

Mobile phones have their own built in UI for managing specific fields. If you can leverage these features then it will save on space and development time. The built in UI have been built with mobile in mind… why not use them.

Tip #4 – Simplify process

The checkout on a desktops take a while and have a lot of information to fill out. Just imagine how that translates to your phone. I would probably flip a few tables in the process. To prevent seeing a table flipping epidemic, try having only vital fields needed to complete the purchase process. Use existing data to populate fields, use Geolocation, use their address to refine the shipping taxes etc. Also while I’m on the topic of updating vital fields, make it easy to go back and change vital fields. If after all this you still want the user to fill out more fields that aren’t vital try after the process is complete. At least if the user doesn’t want to enter the extra data the purchase process has already been completed.

Related: How Will iBeacon Bridge the Gap Between Retail & eCommerce?

Tips #5 – A/B testing


Every sites target demographic is different, A/B test the S#!T out of your checkout and see what’s working and what isn’t. Look into heat mapping your checkout to see where users are getting hung up; see what areas you can speed up, which areas are doing well and why.

Related: [Webinar Recording] – A/B Testing: Real Tests & Data

Tip #6 – Quick load

Keep load times as low as possible, they are on a mobile phone after all.

Related: Mobile Web Performance: How Fast Do Sites Load?

If you’re interested in responsive and want something to inspire you to enter the world of responsive, check this out.

Subscribe to the Blog

Stay updated with 20,000+ eCommerce leaders in our community

Sign Up

Let’s talk about your 10X return

Icon/Social/Phone Contact us for pricing information