If you’re not already familiar with what a mobile app landing page is, you’re a mobile landing page guru, or maybe somewhere in between, you’ve come to the right place.
With more and more eyeballs staring at mobile screens, making your landing pages optimized for mobile is key for superb conversion rate optimization. In fact, it’s more than likely that over a quarter of the people reading this article are reading on their phones — That’s a big piece of pie.
With all of that said, simply shrinking sizes and shifting content around on your desktop landing page to be mobile-friendly is not the only answer to killing your mobile conversion game, but we’ll get to that later.
First let’s get some basic definitions out of the way…
What’s a Mobile Responsive Landing Page?
In the simplest of definitions, a mobile responsive landing page is easy to navigate on desktop, mobile, and tablet.
A landing page (or any website for that matter) that uses incoming information on browsers, screen resolution, the operating system you’re using, among other things to create a customized presentation — Be it for desktop, tablet or mobile. The developer codes with aligned text, resized images, and shuffled tables to create a visually friendly layout.
What’s a Non-Mobile Landing Page?
These are static pages set with fixed borders, image sizes, location of text on the page, margins, and other fixed elements. These are the typical websites or landing pages where you are scrolling across the page and pinching in and out to accomplish a task on your phone.
What’s a Mobile App Landing Page?
A mobile app landing page promotes an app. Whether the app has been launched for 5 years on the iOS or Android store, or is still in the process of beta testing, you should always have a page to promote your app for potential users, similar to musx’s website.
Mobile app landing pages must also take mobile optimization into account, especially considering these pages allow users to download directly from the landing page on to their mobile device.
5 Reasons Why You Should Care
It’s been a long work day. 5:00 PM and you just finished designing your last, perfect, optimized landing page for the day and you’re ready to wrap up, go home, and crack open a cold one with the boys.
But wait…you forgot to design for mobile.
It’s not a big of a deal right? Actually, it’s a VERY big deal. There are many reasons why you should put down your cold one, and start optimizing for mobile:
- It’s growing and it’s growing fast: Mobile will be the main driver of digital’s growth in 2017, accounting for over 70% of digital and more than one-quarter of total media outlays. According to an article on eMarketer, growth will remain in double digits through the end of the forecast, with mobile ad spending expected to surpass TV in 2019.
- It’s a large market: In the U.S., Mobile usage time is now significantly higher than desktop — Mobile being 51% and desktop being 42%. The other 7% consists of other devices such as tablets. Also, it’s important to keep in mind that 90% of time in mobile is spent in apps while the other 10% is spent on browsers. This means mobile ads are a key component for bringing traffic to a mobile app landing page.
- Mobile is more competitive than desktop: The average session duration on mobile is 72 seconds, whereas for desktop, it’s more than double at 150 seconds. With less time to grab visitors’ attention on mobile, it’s absolutely vital you ensure their experience with your mobile app landing page is effortless.
- Top of the funnel conversions: 70% of mobile searches lead to online action within an hour while 74% of people use their mobile phones to help them while shopping.
- It’s easy and it’s cheap: With the availability of free, easy-to-use frameworks such as Bootstrap or even Skeleton CSS Boilerplate, there’s no excuse for having non-responsive landing pages or websites. If you’re willing to spend cash and/or coding isn’t your forte, Unbounce, Instapages, or Leadpages work great.
The reason why we use this kind of software is because it allows us to:
- Lower costs associated with creating individual landing pages
- Allow developers to work on other projects
- And most importantly, create landing pages that convert both in desktop and mobile.
With mobile growing faster and faster while user attention spans are only getting shorter, it makes sense why designing landing pages with mobile in mind is essential for successful conversion rates.
5 Ways To Win Your Conversion Game
Mobile users want immediate access to key data. Remember how we talked about how mobile users tend to be top of the conversion funnel?
This means we need to gently (yet briefly) guide our visitors to the task they’re wanting to complete — Be it making a call to get more information, or signing up for a newsletter to receive a notification when an item is in stock, to name a few examples.
- Click-to-Call: 42% of searchers have used click-to-call to contact a business; 70% have needed to call a business directly from Google.
- Click-to-Scroll: Instead of forcing the user to scroll for that data (or more likely, bounce) adding a Click-to-Scroll button allows them to navigate directly to their desired point on the landing page. Adding two of these buttons can reduce a page’s bounce rate up to 37%.
- Sticky Headers & Footers: A study conducted by Smashing Magazine showed that sticky navigation bars allowed users to find what they were looking for 22% faster. The same study found that 100% of participants preferred sites with sticky navigation bars, despite often not knowing why.
- Mobile Popups: For visitors looking to make a purchase, including a popup that displays a Click-to-Call button can have a significant increase in conversions.
- Overall Form & Functionality: This could could be an entire article of its own, but I’ll try to keep it short and sweet. As far as typography and font size goes, fonts should be legible and applicable to your brand.
This is important, because you want to utilize the time your visitors spend on your mobile app landing page wisely, which is an average of about 15 seconds.
Also, if you choose to have a form, make sure to include as few fields as possible, especially in the first step in a 2-step form. Depending on your industry, the average visit to a landing page can be less than 15 seconds. It’s important to ensure the visitor’s decision-making process is as simple as possible. This is the true foundation of conversion rate optimization.
10 “Do’s” for Mobile Landing Pages
Although there are formulas and methodologies to building a perfect mobile app landing page, the best way to figure out if you’re doing it right is periodic A/B testing.
What I mean by that is, make sure you are taking feedback from your visitors to ensure your landing page is really doing its best to cater to their needs. Split testing two variations of the same landing page is the best way to ensure conversion rate success.
Here are some rules you should stick to when conducting tests with your mobile landing pages:
- Quick load time: 1 second delay can cost a site like Amazon $1.6 billion in sales.
- Short action-oriented titles: Be clear, concise, and leave no room for interpretation. Walls of text won’t get you high conversion rates.
- Short, smart landing page copy: As Envato Tuts + mentions:
- A CTA button that works well in touchscreen mode: This means avoid using hovering options for mobile and make sure buttons and form fields are large enough for fingers.
- Keeps most relevant information above the fold: This includes your call-to-action, titles, and any information your visitor would want to know before acquiring your product or service.
- Looks good in landscape and portrait mode: When designing for mobile, DO NOT forget landscape ratios.
- No unnecessary navigation links: The more distractions on a mobile app landing page, the less likely you are to convert.
- Asks for minimum information on forms: Mobile users want information and they want it quick (much quicker than visitors on desktop). This means don’t waste their time and only ask information that is absolutely necessary, but also make them feel like the services or product you’re offering them is personalized and will cater to their specific needs. Make sure you absolutely need their phone number and email AND address before adding that to any form.
- Possibly uses a “click-to-call” button vs. a CTA button: As we discussed earlier, many visitors on a mobile page are looking to call a business. It’s important to not play hard-to-get and allow them to call whenever possible.
- Whitespace: Use clean designs that are easy to digest for visitors. Too little white space can prevent visitors from making decisions you want them to make (AKA converting).
“Design isn’t the only factor in high conversion rates. Copy plays an enormous part. But the greatest copy in the world won’t help if your visitor is distracted, offended – we all know bad design can be downright offensive – or confused.”
Here are some examples of fantastic, optimized, mobile landing pages:
5 “Dont’s” for Mobile Landing Pages
No matter what you’re testing for your mobile app landing page, these are rules that you should always follow:
- One size fits all landing pages: Ignoring mobile all-together is a big mistake and ignores a large market share.
- Slow-loading heavy imagery: A great, free resource we use for this problem is Tiny PNG.
- Below the fold call-to-action: You want the product or service you’re offering to be the first thing visitors see. If you try to make them work for it, they most likely won’t.
- Being too wordy: A great solution to this could be using bulleted or numbered lists, iconography, and imagery instead of long paragraphs.
- File downloads: Although this is fine for landing pages on desktop, most mobile devices aren’t able to download large, hefty files.
Stick to these rules, and your conversion game will definitely benefit and you will see results – we certainly do.
3 Examples of Poor Landing Pages
Here are some examples of sad landing pages you should avoid (no offense).
We could go on and on with what’s problematic about this page. Text is small, unreadable, buttons and links are too small to press with a finger and in order to see the whole page on your phone screen, you have to pinch outward:
However, it is important to make the distinction that this is a website, not a landing page. Even so, website and landing pages alike should always have mobile in mind.
Not sure what is with these government pages, but they show great examples of what not to do — small buttons (or even worse, links instead of using buttons), tiny hero shot, and an unclear direction on where to navigate depending on the user’s purpose for visiting the page:
Yes, there’s such a thing as having too many deals. Instead of gently guiding your visitor to sign up or buy something, you’re bombarding them with choices and decisions they don’t want to make. This is poor practice for both mobile AND desktop:
Kissmetrics explains this phenomenon perfectly:
“Too many discounts on several products gives the impression of a shotgun approach to marketing instead of a calculated campaign.:
Mobile App Landing Page Final Thoughts
With up to 60% of users browsing the web on their mobile devices, forgetting about your mobile users means neglecting potential leads. If your UVP (Unique Value Proposition) isn’t the first thing you see on your mobile app landing page, you’re doing something wrong.
No matter what business you’re in, optimizing your landing page for mobile is the staple to getting the conversions to help you grow.
Leave a comment below and let us know what you think makes a bomb mobile app landing page.