It appears you are using an older version of your browser. This site was developed to be progressive and future-compatible. Please take a minute to upgrade your browser for an optimal experience.
Skip to content
  • Subscribe:

Is Your QR Code Landing Page Mobile and Context Friendly?

Loren McDonald, Silverpop
by: Loren McDonald (@LorenMcDonald)
08 May 2012

I'm a big fan of using all channels to acquire new prospects/customers and their email addresses so you can nurture and engage with them via the email channel. However, it's critical to align your form and registration process with the channel and context the prospect used to opt in or register.

Here's what made me think of this: While paging through a magazine recently while eating dinner, I saw an outdoor paver-brick advertisement that offered a QR code for more information. So, I hauled out my trusty iPhone, scanned the code and was taken to the form shown at right.

Whoa! This looks like the standard form you'd get if you clicked through to the advertiser's site on a conventional desktop computer. It had 21 data fields and/or checkboxes. Fortunately, not all were required.

As a marketer, you know that 100 percent of the prospects scanning your QR code from a magazine ad, brochure, table tent or airport poster ad are doing so with a smartphone or possibly a camera-equipped tablet.

There's really no guessing if they might be using a desktop PC with a 23-inch monitor. They aren't.

Also, if your QR code is on a table tent at a fast-food restaurant or seminar, a sign in a trade booth or an airport poster, you know your prospect is on the go, has limited time and is likely engaged simultaneously in other activities (eating, walking, reading, listening to a presenter, etc.).

So, it's vital to consider both the channel's form and your prospect's context and environment at the time of registration.

For example, if the QR code offer has an immediacy to it, such as an instant coupon, then the content should be presented on the Web following the form submission.

If, however, the prospect is registering for a lengthy white paper while stopping by your trade booth or listening to your seminar presentation, your best route might be to provide a link via email to download the content later.

Here are a few tips to consider when designing your QR code strategy and mobile landing page and form:

  • First, make sure you're using a QR code in the right context. It should go on a surface that the user can scan easily, such as a magazine ad, booth sign or ad poster close to foot traffic.
  • Don't ask for too much information on the form. An email address might be enough to launch your opt-in process. You can use progressive profiling to collect more information, either to target messages or to qualify the prospect.
  • Consider using social sign-in functionality to make it quick and easy for prospects to register with their social identities and a couple of finger taps.
  • Put your key information at the top and "above the fold" (within the first screen without scrolling). Test your mobile landing page on the most popular smartphones where the QR code will be deployed. See where your page or form cuts off. If key information or form fields are cut off, move them up.
  • Don't use Flash. iPhones and iPads don't render Flash. So, your landing page visitor will see a big blank.
  • Minimize load time. Many users will be accessing your page over their cellular network, or perhaps a slow Wi-Fi connection. If your page takes too long to load, many people will bail.
  • Avoid making visitors type lengthy responses, which can be difficult and error-prone with virtual keyboards. Instead, consider using checkboxes, lists, radio buttons and select menus.
  • Try to avoid making visitors scroll to complete any registration process or to see vital information. If you must, have them scroll down and not sideways.
  • According to Smashing Magazine, top-aligning form text is preferred over left-align, as text can be cut off when using the field zoom function.
  • Another great recommendation from Smashing Magazine: Specify input formats. For example, with HTML5-friendly mobile browsers, specifying an input of the type "email" brings up a virtual alphanumeric keyboard with "." and "@" keys.
  • Avoid lists of hyperlinks, such as a set of resources, one on top of each other. They can be hard to click on a touch-screen, and people will bail when they hit the wrong link a few times.
  • Increase icon and font sizes