Designing Effective Mobile Landing Pages

There are articles in the MicroCreatives blog that tell us about creating effective landing pages and conversion. But how about mobile landing pages? Do we assume that they’re just the same with desktop landing pages? Essentially, all landing pages should have a single goal. It can be to generate leads or sales, among other goals. But to achieve this goal, strategies for mobile landing pages are different from desktop landing pages.


When opting for creative outsourcing, web design services particularly, you need to know about some of the reasons why creating mobile landing pages require more planning and careful consideration.



A regular landing page usually has content at a length of 500 to 1,000 words. However, word count really depends on what suits your goals. The length depends on what you’re selling and your target audience. But when it comes to mobile landing pages, it’s best to convey your message in shorter content. Since mobile devices have smaller screens, it can be more difficult to keep readers’ attention.


You can also measure your visitors’ behavior to determine how much they are willing to read and how far they will scroll on a page before they lose interest. You can do this by testing and monitoring activity. Monitor the patterns on how long they scroll through the content and their level of engagement – do they watch the videos, click the links, fill out the forms?


Studies show that readers do scroll through the page, as long as the interface makes it easy to do so. You don’t have to put everything at the top of the screen, but you can put important information on there and keep interesting enough for viewers to scroll down further. If your page has a contact form and contact information, it’s best to put it above just in case users just want to contact you right away and don’t need to read most of the copy. Form fields can also be reduced so they wouldn’t take up much space and for simpler completion.


Furthermore, make sure to break long paragraphs for mobile. Compressed paragraphs that extend to several lines can have poor legibility and can be discouraging to read.



Pay attention to how the landing page shrinks from standard desktop version to mobile version. Some website features do not work well on mobile. Developing the mobile version with consideration on the features and functions of the page will save all your page viewers from unnecessary content and bulk that will slow down or halt mobile browsing. Just include the necessary information. Make sure your mobile page provides straight-to-the-point information with click-to-call functionality, with form fields large enough to be tapped and filled out easily. The ultimate goal is to convert viewers into contacting you or making a purchase.


UX Barriers

To ensure conversion, know how to avoid UX barriers. Just like testing a website in different browsers, test the mobile landing page in different devices with different screen sizes. This way you can identify the issues beforehand and fix them prior to launching.

  • Interstitial forms/ads. Interstitial forms and ads that persuade users to convert tend to be more annoying than encouraging, especially on mobile where it’s hard to tap the “x” on the pop-up. The frustration can then make the viewer exit the page right away. Luckily for readers, Google has started penalizing websites that have interstitial pop-ups. This is also a warning for websites to avoid this UX barrier.
  • Faulty Responsive Design. Responsive web design is a standard for all websites to provide a better user experience across all devices. However, consider the layout of the elements in the mobile version. Look out for issues and readjust them accordingly. For example, make sure that the contact form stays on top, and the action buttons are always visible and lead to the right page when clicked.

Loading Time

Another thing to consider for mobile landing pages is the loading time. The longer a page loads, the more a viewer gets impatient and turned off. Keep the user’s attention on your page through fast loading and engaging content. You can preload resources on a landing page through HTML5 prefetch. You can also eliminate unnecessary elements, such as images and effects, in the mobile version for faster loading.


Lastly, what a mobile landing page needs is careful planning. Know how you can improve mobile experience and improve your content. Contact MicroCreatives to learn how our web developers, writers, and designers can help.


Reference: Smashing Magazine