Bluetrain Mobile | Mobile Marketing Engine | Mobile CMS

In Transit Blog


Effective Mobile Landing Page Design

by Mike Mai

14
Jun
2011

Mobile Landing Pages
Get ready for the good, the bad, and the ugly in mobile advertising! In our previous blog post, our Conductor and CEO Steffan Berelowitz provided some insights on mobile landing page best practices. I hope you found that helpful! This week, I am showing you examples of mobile landing pages that I have encountered—some are right on track, some are slightly derailed, and some are just train wrecks.

Recap

Let’s recap what was said in the previous blog post:

  • Ensure your text displays at a legible size
  • Keep the copywriting short and sweet
  • Use enticing images and/or graphics
  • Show a prominent call to action
  • Use popular mobile advertising calls to action

With those in mind, let’s now take a look at some mobile landing pages!

Mobile Landing Pages

Train Wrecks (The Ugly)

Let’s start with the uglies. Some of these aren’t ugly aesthetics-wise, they are just not optimized for mobile.

  • Text is too small to read, repeated pan and zoom action is required
  • The content is overwhelming
  • Too many fields to fill out
  • It takes more than 20 seconds to load

Mobile Landing Pages: The Ugly
All of these are Google Adwords campaigns on Google mobile search. It’s a shame they are not even mobile optimized.

Slightly Derailed (The Bad)

The following are all mobile optimized but they might not be following the best practices.

NuvaRing

  • It starts with a pop-up warning message, this will turn away a lot of visitors
  • The text is legible but still too small
  • On the actual landing page, there’s no visual hint as to what’s clickable
  • There’s no clear call to action

Mobile Landing Pages: NuvaRing

Art Institutes

  • Branding is preserved and graphics are well used for each call to action
  • But too many calls to action, the page is too congested and confuses the visitors

Mobile Landing Pages: Art Institutes

Right on Track (The Good)

Now let’s take a look at some really good mobile landing pages—mobile optimized, aesthetically pleasing, and good copywriting.

Kumon

  • The message is concise
  • Benefits are clearly stated
  • Good use of video
  • Call to action is on top of the page and prominent
  • Great brand presence

Mobile Landing Pages: Kumon

LivingSocial

  • Has only two fields to fill out
  • Features only one main call to action
  • One sentence explaining what the vistor will get
  • Shows a list of benefits

Mobile Landing Pages: Living Social

Audi

  • Great brand presence
  • Focus image showcases the product very well
  • One sentence explaining what the product is
  • Features only one main call to action

Mobile Landing Pages: Audi

Dove

  • Great showcase of products
  • Clicking on each product image shows more detail
  • Good use of interactivity: educates the visitor about the products by utilizing an interactive game

Mobile Landing Pages: Dove

Verizon

  • The focus image is on point with the message
  • Bulleted list of benefits is easy to read through
  • Having the same call to action on top and bottom of the page ensures the user to press it
  • Great brand presence
  • Good use of pop culture to draw visitor’s attention

Mobile Landing Pages: Verizon

What do you think?

I hope these examples of mobile landing pages helped you understand the best practices stated in the previous blog post. What is the best mobile landing page you have seen? Let us know in the comment section down below.


About the Author

Mike Mai operates the train of creative thoughts at Bluetrain Mobile. He loves web, mobile and social media. Language skills include Mandarin, Cantonese, and HTML5.
@mikemai2awesome

  • Pingback: "Engaging A Mobile Audience": Our ideaLaunch Webinar | Mobile Web Marketing Blog | InTransit | A BlueTrain Mobile Blog

  • http://haimzarif.wordpress.com Haim zarif

    i love your post – very informitave – i based my mobile designs on your suggestions
    the only problem is i hate that you cant push back on your site. a bit annoying.

    • http://mikeloveschina.com Mike Mai

      Hello Haim, thanks for reading our post. I am not sure what you meant by “push back”.

  • Pingback: Mobile Marketing: A Short Commencement | Work From Home Jobs

  • mobile Site Builder

    Hello..

    I think Nowadays getting tech for mobile site, is becoming a mandatory it is a new and a good way of marketing.

    You have posted nice and informative post,Thanks for sharing..

  • Hilary

    I have a follow up question. Once you create your optimized landing page and the user completes the desired call to action, what do show them next? In other words, where do you redirect them to if your main site is not mobile optimized once they’ve completed your call to action? Thank you, 

    • http://mikeloveschina.com Mike Mai

      Hi Hilary. Great question. A thank you page should always be present after the user completes the call to action. On the thank you page, you can include links back to your main site, social media portals, and contact info. It would be ideal if your main site is also mobile optimized. Regardless, the user should never be automatically redirected to your main site after completing call to action. The thank you page will do wonders for you.


Bluetrain Mobile

Everything Mobile. Anything Possible.