Mobile Web Design – Tips and Tricks from Online Sales Growth


Today I’m going to give you a quick overview of mobile web design, how to create effective mobile web pages,  and why it’s so important to get this area right.

Have any of you experienced the frustration of opening a web page on your smart phone to find you need the eyes of an eagle to read the text?  In a classic example of poor mobile page design it’s just way too small and while you can just about make out the buttons you can’t read what’s on them.  Within seconds you’ve clicked the ‘x’ at the top right corner.

The potential for this scenario is growing as more and more people in the world are using their Smart Phones to go online while they are on the move.  It’s been estimated that by 2020 there will be 12 billion + smart-phones and tablets in the world, more mobile devices than there are people in the world. Ensuring that your mobile web design is tailored for access from mobile devices will therefore grow in importance.

Mobile Web Design

Below Online Sales Growth lay out some basic guidelines to effective mobile web design to help your business reach the people using their smart phones to search for services.  To get the most out of this article I’d suggest getting a QR code reader on your phone if you don’t already have one.  I personally would recommend i-nigma which you can download from here:

Mobile Web Design – Do’s and Don’ts

  • The first thing to remember when developing your mobile web design is that the ‘mobile’ landing page has to be nice and simple, remember that people are viewing these pages through small screens and a large ream of text is just going to put them off!  The ideal mobile landing page will be brief and to-the-point. The Keep It Simple Stupid (KISS) principle rules.  To see the difference for yourself scan the QR codes below, the one on the left takes you to a regular web page, far to big and confusing for use on a mobile, the one of the right takes you to a page tailored for a mobile using these mobile web design rules, which do you think works better?

Biztek-i QR CodeOnline Sales Growth 2 QR Code













  • It’s preferable to use a short video to quickly lay-out what it is that is so compelling about what you’re selling.  This useful little trick to mobile web design has the double effect of drawing your customers in with the higher engagement that video brings and also quickly separates the wheat from the chaff. Those who watch the video and aren’t interested won’t go any further at the cost of only a few seconds of their time.  However, some who come to the mobile landing page will be interested by what they see and want to learn more.
  • The next part of mobile web design to consider is having a large easy to see and read button that takes them to the next level.  This should be just about the only other thing on your landing page.  It may not sound like much to have a page that is just a short piece of text, a video and a button, but remember that this is aimed at mobile users who are out and about, for anything like this to work your initial sales pitch to test the waters needs to be as short, sweet and simple as possible. We aren’t trying to close the deal right here, right now, we’re just getting the basic message of what we’re selling in it’s simplest form out to as many people as possible to see which ones bite, baring this in mind is a key part of mobile web design.
  • Okay, so people have seen your landing page, some of them have decided it’s not for them, but a few are still interested and thanks to your good mobile web design have pressed the button to take them to the next page, what do we do now?  The answer is this can vary to some extent, depending on precisely what it is you’re selling.  If you’re selling small, in-expensive products, the initial landing page might just be followed by a ‘shopping cart page’.  For example if you’re selling t-shirts/apps etc that quick video on the landing page might have given potential customers all the info they need and the next page they get taken to will be the on-line shop where they can browse the products available and see if anything catches their interest.
  • If you’re selling more expensive or more tailored goods or services this approach will be ineffective, but with canny mobile web design the fundamental lessons can still be applied.  Before people part with larger amounts of money you will need to convince them that what you’re offering is just what they need.  The mobile web design of the initial landing page still wants to be short and sweet to filter out those with ‘no-interest’ from those with ‘potential interest’. In the latter case, your next page needs to be a little more in-depth about what it is that you can do to help, your experience and if possible links to testimonials.  Again, remember that this is still a page designed to be viewed by someone on the go, a half hour video epic or ‘War and Peace’ length treaty on your product is going to make many of them loose interest.  Remeber, with mobile web design short and sweet is better!

    LotR HPL
    Not quite what we’re going for!

Mobile Web Design – Summary

  • So, make sure your potential customers get the point as quickly and concisely as possible. You MUST make sure that your mobile web design allows those who are still interested can easily link to more in-depth views of your products and services when they are in front of their large screen display.
  • And don’t forget a key part of mobile web design, making sure they can easily leave their contact details so you can get in touch with them. Offering a free ‘taster’ in return for their details is a very good way to build trust with the new customer from the get-go.

So, as we can see, mobile web design requires some careful forethought and planning but there is huge potential for drawing customers in through mobile devices, but poor mobile web design will wreck new sales opportunities.

If you have any thoughts or questions, or would like to know more about how Online Sales Growth can help you capture the online mobile market and improve your mobile web design, or want to share cool examples of mobile web design you’ve come across, feel free to leave a comment below or send an email to


A useful page with further info on good Mobile Web Design.

Reference links about Smart Phone market growth and QR Codes:

Comments for this post

Leave a Comment


Sign Up Box