With 7.9 billion mobile devices and connections worldwide and faster mobile internet with a broader range, it’s no wonder that mobile e-commerce accounted for almost $105 billion in 2015. It’s also important to note that the vast majority of these purchases – 73% to be exact – are happening over the mobile web, not through apps.
Your landing page is the user’s first impression of your mobile presence, so you need to make the most of it by providing a seamless journey to their desired goal. After a bad mobile experience, 40% of consumers will turn to a competitor’s site because they don’t have the patience to ride it out. Recently, there’s been no shortage of claims that our modern attention spans have dwindled to a paltry 8 seconds.
Some even claim we’ve been leapfrogged by goldfish. Designing a landing page to optimize conversions and combat this problem is tough enough on desktop landing pages, and mobile is a different animal. On a smartphone, one weathers a constant barrage of distractions: push notifications from Instagram, texts from your roommates about cleaning the kitchen, and the buzz-buzz that announces a Pokemon is in the vicinity.
With so much business up for grabs in mobile e-commerce, landing pages need to be exceptionally fine-tuned to keep mobile shoppers around and buying. Though techniques like responsive web design have successfully tied desktop design to mobile, it’s still important to consider the idiosyncrasies of the mobile experience and make design decisions that best target mobile users.
Below are five ways to optimize your landing page to attract and hold onto mobile users:
1. Be Concise and Precise: Brevity is King
The average mobile phone session is only 72 seconds long, about half as long as a desktop session. That means you need to keep things shorter, sweeter and directed to your visitors’ expectations.
Since tablets have about 65% of the screenspace of a desktop and smartphones have 35%, there’s a general consensus to stick to short headlines of four words or less to keep the page clean and uncluttered.
Brevity Done Well: Squarespace
Each word should add value to the user’s experience or face the chopping block. Some companies even go so far as to design landing pages sans words, focusing more on high-quality hero images to get the page’s product or service across to the visitor.
2. Be Highly Visible, With Text and Color For All
Everyone’s visited a mobile web page and felt that annoying twinge – what is this, written 4 point font? Nothing is immediately legible and in order to find the information you’re seeking, you must pinch and zoom, scanning only a small quadrant at a time.
This is deadly. Not only will visitors be put off by illegible text, but once a visitor has pinched and zoomed, you’ve lost control over where they’re focusing their attention.
Example of Bold Brilliance: SocialSafe
To prevent this, create a page that keeps readability in mind: color combinations with a simple palette and high contrast, text at 16 pixels minimum, and enough negative space to ensure elements don’t overlap. Finally, make sure you have designed for both landscape and portrait modes for mobile devices.
3. Call the Visitor to Action
They approach your page with a clear objective and, in order to hook them, you’ll need to provide a simple pathway to fulfillment. Because of this, it’s essential that you provide a clear Call to Action like a “Buy Now” button, preferably above the fold, so that visitors can easily see it.
Fantastic Call to Action: Simple
Mobile also influences offline actions to the tune of $1 trillion a year, so if you’re a business with physical locations, be sure to provide for those visitors mostly in search of info regarding business hours, location, and directions. Overall, know what a visitor to your page is in need of and provide them with a CTA that most readily satisfies that need.
4. Slim Down to Speed Up
Mobile users expect a browsing experience akin to their desktop experience, and this is no different when they’re considering speed. 30% of mobile users will only wait 6-10 seconds before they abandon a page; 16% will only wait 5 seconds.
But mobile data connections are slower than the broadband many have at home, so you must build your site anticipating the limited data of your mobile visitor. Ideally, limit your overall page weight to 200 KB to ensure fast loading.
Minimal Scripts, Mobile Optimized: Instapage
Minimize the number of scripts and only use mobile-optimized images to reduce requests. To see how large and efficient each element on your page is, use a speed test and identify the logjams hindering your mobile page’s speed.
5. Shoot for Form Simplicity
There’s a reason there aren’t any mobile-penned novels in the world. From mini-QWERTY keyboard angst to mystifying autocorrects, typing on your phone is frustrating. This is a good reason to keep any forms you provide on your page like account set-up, store locators, or newsletter sign-ups limited in the number of mandatory fields and geared towards being type-free.
Ideal Form: InboundWriter
First, use drop down menus when possible, and if typing is necessary, be sure to switch the visitors to the appropriate keyboard – numerical or alphabetical. Localization can also help reduce typing by autofilling the city, state, and zip code input.
Finally, if a mistake has occurred in a form, make the experience as pleasant and easy to fix as possible. Present a relaxed, positive tone by highlighting missed or incorrect fields instead of reloading the page with an error message.
With so much of e-commerce flowing towards mobile today, it’s essential for any business to take mobile seriously by creating a user-friendly, high-conversion landing page targeting mobile devices.
Do you have any other insights? Leave your comments below!