Conversion Rate Optimization

Boost Mobile Conversion Rates with Mobile-Friendly Forms

May 3, 2021
|
Melanie Angel

If your forms aren’t mobile-friendly, you’re probably missing out on conversions.

According to data presented by Statista, the percentage of web traffic from mobile devices is on the rise, hitting an all-time high of 54.8% in the first quarter of 2021.

Unfortunately, mobile conversion rates still lag behind that of desktop.

Why?

For one, mobile page speeds. How fast your website loads matters, especially on mobile. In fact, even a one-second delay in mobile load times can impact mobile conversion rates by up to 20%!

But all the page speed improvements in the world won’t help a poor mobile form experience. When web forms aren't designed for mobile screens, users must pinch, zoom, and scroll around the screen to fill in forms. It’s not a great experience, causing some users to abandon the form in frustration before converting.

6 Ways to Increase Mobile Conversions with Better Mobile Pop-Up Form Design

Bottom line: if your forms aren’t mobile-friendly, you’re probably missing out on conversions. Fortunately, there are ways to fix that. Here are 6 mobile conversion rate optimization tips that you can implement in your forms to convert more mobile users.

examples of mobile-friendly responsive forms
A few examples of mobile-friendly pop-ups.


1) Follow mobile design best practices in your forms and pop-ups.

Mobile design prioritizes usability on smaller screens. To give your mobile users the best form experience, use a form builder that offers mobile-friendly pop-up templates, or follow these guidelines as you build your mobile forms:

  • Build pop-ups and forms with mobile-friendly dimensions. While mobile devices give you some leeway on height, we recommend building mobile forms with a maximum width of 400px. For more details, check out our guide to recommended lightbox dimensions.
  • Create touch-friendly form fields and buttons. Make sure all fields and buttons (including your close button!) are large enough for your visitors to comfortably click.
  • Give users some space. Leave enough space between form elements to prevent users from touching the wrong field or button. Also, add extra padding around your text to make sure that it doesn’t cut off on any devices.
  • Use responsive design. Responsively-designed forms ensure that your forms will display correctly on any device or screen size.
  • Test your forms on mobile devices. While simply resizing your browser window can approximate how forms look on mobile, running tests on a real mobile device provides the most accurate results.
mobile pop-up best practices
These mobile-friendly forms follow mobile best practices with properly-spaced form fields, larger text, and a tappable button.

2) Create mobile-optimized lightboxes or pop-ups that trigger only on mobile devices.

If your pop-up solution allows you to target users by device, you can trigger completely different versions of your forms for different devices. This allows you to create larger, more intricate designs for your desktop audience while still showing forms that respect the user experience of your visitors on mobile.

Creating separate versions of your pop-ups for different devices can also help you track desktop vs. mobile performance.

If you do create separate forms for different devices, make sure your mobile-only form follows best practices!


3) Exit-intent on mobile: trigger mobile pop-ups when users go idle.

On desktop, websites use exit-intent pop-ups to trigger lightboxes that appear when a visitor moves their cursor out of the browser window. These lightboxes tend to earn high conversions, but how do you replicate that success on devices where there isn’t a cursor to track?

Instead, use idle timers to trigger a pop-up after several seconds of inactivity.

These timed pop-ups can help prevent browse abandonment, but the right pop-up content can also help your visitors. Sometimes, users may go idle on your site because they’re not sure where to go next. Use these idle pop-ups to guide your visitors with helpful information:

  • Display a coupon code that shoppers can use if they’re on the fence.
  • Show a product recommendation quiz that can help them find relevant products.
  • Give shoppers the option to save their cart to their email so they can retrieve it later.
  • Inform users about promotions, shipping discounts, or limited-time deals.

By delaying your mobile pop-ups until visitors go idle, you can also respect your mobile users by not bombarding them with pop-ups as soon as they hit your site.


4) Grow your text messaging list with one-tap mobile opt-ins for SMS.

If you use your website to grow your SMS list, it’s important to give these potential new subscribers the best mobile experience.

With one-tap opt-in buttons, visitors can opt into your mobile messaging without having to fill out a form at all. One-tap buttons work by populating an opt-in text in visitors’ native text messaging app. All users have to do is hit “send” on that message, and they join your list.

one-tap mobile opt-in for SMS marketing
This one-tap mobile opt-in pop-up allows users to quickly opt into text messages.

Remember to include all necessary compliance text in your mobile opt-in paths to ensure your SMS program remains compliant with TCPA and CTIA guidelines.

Digioh allows you to build mobile-friendly SMS opt-in forms that integrate with all leading SMS marketing platforms, including Postscript, Attentive, and Klaviyo.


5) Increase mobile form completion rates with progressive capture forms.

The more fields in your form, the less likely a visitor is to complete that form. This is especially true for mobile, where tiny screens make completing multi-field forms tricky.

If you need to collect additional data from your visitors, use progressive multi-page forms. These forms can help you improve the mobile experience by capturing data now and allowing visitors to provide more information later, if they wish.

For instance, the mobile form below collects the email address first, then asks visitors if they would like to opt into text messages. If so, the form triggers the one-tap mobile opt-in text path mentioned above.

When users click on the "Unlock 10% Off" banner (1), they see an email capture pop-up (2). If they complete the pop-up, the next screen invites them to opt into text messaging (3), which they can do by simply sending the pre-populated text (4).

Digioh’s progressive mobile forms submit data at every step of the form, allowing you to collect data, even if a visitor abandons the form before reaching the last page. This way, you can collect an email address without forcing visitors to provide their mobile number or other data too.


6) A/B test your mobile pop-up forms.

What works for your desktop audience doesn’t always work for mobile visitors. A/B and multivariate testing can help you identify the creative and tactics that best resonate with your mobile audience.

Here are a few ideas to test in your mobile forms:

  • Timing: How many seconds should you wait before triggering your pop-ups?
  • Discounts: Can you convert more shoppers with a 20% off coupon vs. a 10% coupon? And does the higher discount drive enough additional sales to make economic sense?
  • Form Factor: Does a full-screen lightbox, smaller banner, or even an inline mobile form lead to more conversions?
  • Copy: What kind of copy will convince the most visitors to convert: copy using a straightforward tone or something more fun? Shorter or longer copy? Does your current copy convey the value of signing up for your email list, or can you convert more visitors with a stronger statement?

There are near-endless possibilities for optimizing your forms with testing, so make sure your mobile form & pop-up solution provides the testing capabilities you need to maximize conversions.

For instance, with Digioh’s multivariate testing, you can test multiple form variants against each other, control the percentage of your audience that sees each version, and automatically deploy the winning form to the rest of your audience when your test is complete.

examples of mobile friendly product recommendation quizzes on a mobile phone mockup
Even the most complex product recommendation quizzes can be mobile-friendly. Make sure your form or quiz builder provides plenty of mobile customization options!


Mobile conversion rate optimization starts with a better mobile experience.

As you optimize your site to cater to your mobile audience, don’t forget about your forms and pop-ups! If you need a form builder that allows you to build better mobile pop-ups, we can help. Digioh’s drag-and-drop builder allows you to create forms, pop-ups, surveys, and more that look great on any device. Take a tour of our mobile-friendly pop-up builder, and take the first step towards improving your mobile conversion rate.


Melanie Angel
Marketing Manager
Melanie is a marketing manager at Digioh. When she's not doing the B2B SaaS marketing thing, you can probably find her watching soccer, playing skeeball, or seeing a show. She lives in Austin, TX, with her 0 pets and 1 guitar.

Continue reading

Branded Quizzes Done Right: Creating a Custom Product Recommendation Quiz

How to Optimize Your Ad Spend with a Quiz

How to Increase Your Average Order Value with Guided Selling

Turn More Visitors into Customers

Schedule a session with our conversion experts to discover how you can drive more revenue with consumer-consented data.
Get a Demo